记录本书中尚不熟悉的知识点,结合项目简单回顾
- 属性选择器,注意几个符号的用法
~
,^
,$
,*
,|
- 常用伪类(6)和伪元素(4)。
伪元素中关于first-
还要注意使用它的元素是不是块级 - 优先级
使用tuple
方式计算,(内联,id选择器,类选择器/伪类选择器/属性选择器,元素选择器/伪元素选择器)=(0,0,0,0)
,根据选择器在相应位上加1,当然!important
优先级艳压群芳 - web安全色?就像一个冷僻知识大比拼,看谁知道
-
em
基于本身的font-size
,而这个属性是可以继承的。rem
基于html
元素的字体大小 - 项目中常用字体,
sans-serif,"Microsoft YaHei","微软雅黑",STXiHei,"华文西黑"
。涵盖了英语,中文(window系统),中文(os
系统)字体显示情况。注意何时加引号
百分比多次出现,但是在不同属性中,作为基础比较的可能是自己的属性,可能是父元素的属性。分情况牢记
-
font-weight
100-900对应什么呢?normal
,bold
。font-size
的em
和百分比单位%
,都基于自己父元素(em应该基于自己的font-size,但是此时,都没有font-size,就基于父元素的咯),继承的是计算值不是百分比。line-height
中百分比基于自己的font-size
,em
基于font-size
,缩放因子(无单位实数)是继承值,不是计算值。font
属性的合写注意font-size
和font-family
必写有序,容易覆盖之前写的line-height
- 文本
-
text-indent
可继承,百分比基于父元素宽度 - 基线对齐原则,使得一些替换元素的底线与基线对齐
- 水平垂直居中对齐和自身宽高的问题
-
letter-spacing
和word-spacing
,对汉字起作用的是前者哟。关于word
还有word-wrap
和word-break
(这两个是css3,两者有区别的) -
text-transform
大小写啦,首字母啦,一个属性搞定 -
text-decoration
不继承,种类多 -
text-shadow
顺序什么的随意 -
white-space
如何处理空白符和换行呢?实际处理中,空白符(空格和tab键)会被合并成半个汉字的大小,换行,会被合并成一个汉字大小的空白,这里就是规定到底合并哪些?还是不合并,保留原样 -
direction
和unicode-bidi
文本方向
- 基本视觉格式化
- 过分受限,浏览器会重置右边距,使子元素水平等于父元素内容宽
- 左边距负值,超出浏览器,右边距负值,修复水平总和问题,不会超出浏览器。上负边距,将自身上提,下负边距,将兄弟元素上提
- 水平属性和垂直属性,各七个,其中
border
不能使用百分比。除了height
百分比基于父元素height
,其他都基于父元素width
- 替换元素和非替换元素
line-height
,padding
,margin
对于内容高度或者行框高度的影响
后七章在以下链接中,感觉还不错的话,来个赞怎么样?有任何不对之处,劳烦指教!