传智CSS笔记

这也是看传智CSS的视频教程记录的笔记！

---------------------------------------------------------------------------------------------------

选择器的优先级：

行内选择器》id选择器》类选择器》标签选择器》通配符选择器》继承样式》默认样式

 

Display :

Display:inline 可以将块级标签变为行内标签

Display:block 可以将行内标签变为块级标签

Display:none 整个标签移除掉，不影响页面的布局

visibility:hidden 只是不显示，但是还是占用页面的空间

Display:inline-block 行内块元素，可以设置宽高

行内元素不能设置宽高，只能通过他的内容来撑开宽度和高度。如果设置了宽高是不会影响行内元素的显示 的。

字体：

设置font-family时，需要注意以下几点：

各种字体必须使用英文状态下逗号隔开；

中文字体需要加英文状态下的引号，英文字体一般不需要加引号。当需要设置英文字体时，英文字体必须位于中文字体名前；

如果字体中包含空格、#、$等符号，则该字体必须加英文状态下的单引号或双引号；

尽量使用默认字体，保证在任何用户的浏览器都能显示。

为了更安全的设置：

font-famliy: tahoma,arial,'Hiragino Sans GB',\5b8b\4f53,sans-serif;

前面的字体都查找失败后，在系统中找到一种sans-serif字体作为默认字体。

注意顺序，如果把sans-serif 放到前面去了，后面的都失效了。

font-weight字体粗细：

bolder lighter 100~900(100的整数倍)，有继承性

400：normal

700：bold

font-style字体风格

normal：默认值

italic：浏览器会使用斜体的字体显示，如果字体没有斜体，那么正常显示字体

oblique：浏览器会让字体倾斜显示。。。

font综合设置字体样式：

选择器{font: font-style  font-weight  font-size/line-height  font-family;}

必须按上面的语法格式顺序写，各个属性用空格分开。

不需要设置的属性可以省略（取默认值），但必须保留font-size和font-family属性！！！

空白符的处理：white-spacing:

word-break：自动换行

normal使用浏览器默认的换行规则，不打断单词显示。

break-all允许在单词内换行

keep-all只能在半角空格或连字符处换行

去掉图片边框的写法：

border: 0 none;

内边距属性：padding

·········

外边距属性：margin

·········

。。。。。。。