FreeCodeCamp之前端开发学习笔记1

    xiaoxiao2024-03-31  121

    1、有三个影响HTML元素布局的重要属性:padding(内边距)margin(外边距)border(边框)

    元素的 padding 控制元素内容 content和元素边框 border 之间的距离。元素的外边距 margin 控制元素边框 border 和元素实际所占空间的距离。

    元素的 margin 控制元素的 border 和元素实际所占空间的距离。

    如果你将一个元素的 margin 设置为负值,元素将会变大。

    有时你想要自定义元素,使它的每一个边具有不同的 margin。

    CSS 允许你使用 margin-top、margin-right、margin-bottom 和 margin-left 来控制元素上右下左四个方向的 margin。

    有时你想要自定义元素,使它的每一个边具有不同的 padding。

    CSS 允许你使用 padding-top、padding-right、padding-bottom 和 padding-left来控制元素上右下左四个方向的 padding。

    除了分别指定元素的 padding-top、padding-right、padding-bottom 和 padding-left 属性外,你还可以集中起来指定它们,举例如下:

    padding: 10px 20px 10px 20px;

    这四个值以顺时针方式排列:顶部、右侧、底部、左侧,简称:上右下左。

    2、给id设置的样式优先级比class设置的要高,不论定义先后顺序。

    我们证明了无论在 style 元素 CSS 的哪个位置进行声明,id 声明都会覆盖 class 声明。

    还有其他覆盖 CSS 的方法。行内样式也会覆盖其他样式声明。

    很多情况下,你会使用 CSS 库,这些库可能会意外覆盖掉你自己的 CSS。所以当你需要确保某元素具有指定的 CSS 时,你可以使用 !important

    比如:

    .pink-text {     color: pink !important ;   }

    这样就不会被别的样式覆盖了。

    最新回复(0)