css核心基础--Day04

css核心基础

css样式规则

1. 选择器{属性1：属性值1；...};

2. 且严格区分大小写。

3. 若属性值由多个单词组成且中间有空格，则必须加英文的引号

4. css注释(/......../)

引入css样式表

行内式

<标记名 >内容</标记名>

内嵌式

<style type="text/css"> 选择器{属性1：属性值1；} </style>

链入式

<link href="css的文件路径" type="text/css" rel="stylesheet" />

导入式

@import url(css文件路径)；

css基础选择器

标记选择器

标记名{属性1：属性值1；}

类选择器

1. .类名{属性1：属性值1；}

2. <标记名 class="类名">内容</标记名>

ID选择器

1. #id名{属性1：属性值1；}

2. <标记名 id="ID名"> 内容</标记名>

css字体样式

font-size；font-family;font-weight;font-variant;font-style;

font-variant：定义小型大写字母，仅对英文字符有效；

其属性值有：normal；small-caps；

font:综合设置字体样式

选择器{font: font-size；font-family;font-weight;font-variant;font-style;}

css文本外观属性

1. color

2. letter-spacing:字间距

3. word-spacing:单词间距

4. line-height:行间距

5. text-transfer:文本转换 控制英文字符大小写

   属性值：capitalize=首字母大写；uppercase=全部字符转化为大写；lowercase=全部字符转化为小写；

6. text-decoration：文本装饰

   underline；overline；line-through=删除线；

7. text-align：水平对齐方式

8. text-indent：首行缩进

   允许使用负值；通常使用em；

9. white-space:空白符处理

   pre=空格变大；nowrap=增加滚动条；

css高级特性

标签指定式选择器

其中一个为标记选择器，第二个为id选择器或类选择器；如p.special

后代选择器

外层标记写在前面，内层标记写在后面，中间用空格分隔

p strong

并集选择器

标记名，类名，ID名....

css层叠性和继承性

层叠性

叠加

继承性

统一用 body

优先级

标记选择器优先级为1；类选择器为10；id选择