CSS基础

一、CSS是什么

1、什么是css

层叠样式表、级联样式表

2、css有什么用

二、CSS核心

1、引入方法

1）头部样式

<style>
	css 代码段
</style>

2）外部链接

<link herf="CSS文件路径"type="text/css" rel="stylesheet">

3）内联样式(不推荐 测试)

<tagName style="css代码段"></tagName>		

2、css选择器

1）统配选择器

匹配页面所有元素
*{
样式
属性名:值;
属性名:值;
属性名:值;
…
}

2）标签选择器

匹配页面指定的某个元素n次
tagName{}
p{}
input{}
a{}

3）类选择器

匹配页面具备class 属性的元素
class=“test”
.类名{
}

.p1{
}

4）id选择器

匹配页面具备id 属性的元素
id=“test” id具备唯一性
id js能获取dom
权重过高
#test{
}

三、文本的样式属性

1、字体样式属性

1)、font-size：字号大小

属性值了可以使用相对长度单位em，推荐使用像素单位px。

2)、font-weight: 字体粗细

属性值默认normal，可以设置加粗bold,更粗bolder

3)、font-family:字体

属性值通常可以设置为黑体、微软雅黑、宋体

4)、font-style:字体风格

属性值默认为normal，可以设置xieti 样式italic,或者oblique。

5)、font:

复合属性，font:font-style font-weight font-size/line-height font-family
前两个属性可以省略或者调换位置，后面的两个都不可以。

2、文本样式属性

1)、line-height：行间距

单位通常使用px,em或者百分比。

2)、text-align: 文本对齐方式

属性值默认left左对齐，可以设置为center居中，也可设置right右对齐。

3)、text-decoration:修饰线

属性值默认是none，可以设置下划线underline，删除线line-through，上划线不常用。

4)、text-indent:首行缩进

属性值可以为不停单位的数值，em字符宽度的倍数，或者相对浏览器的百分比，允许使用负值。

5)、color:文本颜色

属性值可以是十六进制表示颜色，或者英文单词，或者用rgb表示。

四、CSS的高级特性

1、CSS的层叠性

多种CSS样式可以叠加，例如内联式定义p字号大小6px,链入式定义p颜色为蓝色，那么p标签的字体就是6px,蓝色。

2、CSS的继承性

子标签继承祖先的属性，例如字体样式和文本样式属性。

3、CSS的优先级

自己写的样式 > 继承过来的样式 ; id> > class > 标记 ;行内 > 内嵌；行内 > 链入；内嵌和链入比较权重，权重相同就近。