随笔分类 - CSS
摘要：1、rem单位 ①、相对单位； ②、rem单位是相对于HTML标签的字号计算结果； ③、1rem = 1HTML字号大小； 2、vw单位 ①、vw单位可以根据窗口的宽度自动改变大小，1vw是窗口宽度的1%； ②、vh单位可以根据窗口的高度自动改变大小，1vh是窗口高度的1%； ps：vw是css的一
阅读全文
摘要：①、利用margin实现： ②、利用translate实现：
阅读全文
摘要：场景：让某元素本身在屏幕中不可见。如：鼠标:hover之后元素隐藏； 常见属性： 1、visibility: hidden; 2、display: none; 区别： 1、visibility: hidden;隐藏元素本身，并且在网页中占位置； 2、display: none;隐藏元素本身，并且在网
阅读全文
摘要：1、静态定位 介绍：静态定位是默认值，就是之前认识的标准流。 代码：position:static; 注意点： ①、静态定位就是之前的标准流，不能通过方位属性进行移动； ②、我们之后说的定位不包括静态定位，一般特指后几种：相对、绝对、固定； 2、相对定位 介绍：自恋型定位，相对于自己之前的位置进行移
阅读全文
摘要：(1)、伪元素：一般页面中的非主体内容可以使用伪元素； (2)、区别： ①、元素：HTML设置的标签； ②、伪元素：由CSS模拟出的标签效果； (3)、种类： (4)、注意点： ①、必须设置content属性才能生效； ②、伪元素默认是行内元素；
阅读全文
摘要：1、字体font相关属性的连写 (1)、属性名：font (2)、取值：font：style weight size family； (3)、顺序要求：swst (稍微舒服) (4)、省略要求：只能省略前两个，如果省略了，相当于设置了默认值； (5)、注意点：如果需要同时设置单独和连写形式 ①、要么
阅读全文
摘要：(1)、场景：给行内元素设置margin和padding时； (2)、结果： ①、水平方向的margin和padding布局中有效； ②、垂直方向的margin和padding布局中无效；
阅读全文
摘要：1、合并现象 (1)、场景：垂直布局的块级元素，上下的margin会合并； (2)、结果：最终两者距离为margin的最大值； (3)、解决方法：只给其中一个盒子设置margin即可； eg: 2、塌陷现象 (1)、场景：互相嵌套 的 块级元素，子元素的 margin-top 会作用在父元素上,结果
阅读全文
摘要：1、作用与优势： (1)、作用：根据元素在HTML中的结构关系查找元素； (2)、优势：减少对于HTML中类的依赖，有利于保持代码的整洁； (3)、场景：常用于查找某父级选择器的子元素； 2、选择器 n的注意点： 1、n为：0、1、2、3、4、5、6...... 2、通过n可以组成常见公式
阅读全文
摘要：3.1交集选择器：紧挨着 (1)、作用：选中页面中同时满足多个选择器的标签； (2)、选择器语法：选择器1选择器2{css} (3)、结果：(既又原则)找到页面中 既 能被选择器1选中，又 能被选择器2选中的标签，设置样式 (4)、注意点： ①、交集选择器中的选择器之间是紧挨着的，没有东西分隔； ②
阅读全文
摘要：2.1并集选择器: ， (1)、作用：同时选择多组标签，设置相同的样式 (2)、选择器语法：选择器1，选择器2{css} (3)、结果：找到选择器1和选择器2选中的标签，设置样式 (4)、注意点： ①、并集选择器中的每组选择器之间通过，分隔； ②、并集选择器中的每组选择器可以是基础选择器或者复合选择
阅读全文
摘要：1.1 后代选择器：空格 (1)、作用：根据HTML标签的嵌套关系，选择父元素后代中满足条件的元素； (2)、选择器语法：选择器1 选择器2{css} (3)、结果：在选择器1所找到标签后代（儿子、孙子、重孙子...）中，找到满足选择器2的标签，设置样式； (4)、注意点： ①、后代包括：儿子、孙子
阅读全文
