CSS全称为“层叠样式表(Cascading Style Sheets)”，它主要用于定义HTML内容在浏览器内的显示样式，如文字大小、颜色、字体等使用css样式的一个好处就是通过定义某个样式，可以让不同网页未知的文字有着统一的字体、字号或颜色等css的形式基本分为以下三种：
(1)内联式 (2)嵌入式 (3)外部式
(1)内联式：直接将css代码直接写入现有的HTML标签中。例如<p style="color:red">文本</p>
(2)嵌入式：将css样式写入head/head中的style type="text/css"/style中。例如：p{ font-size:12px;}(3)外部式：将css代码写在一个单独的外部文件中，拓展名为.css。使用<link rel="stylesheet" type="text/css" href="文件源" />
注意三点：1.css样式文件名称用有意义的英文字母命名
2.rel="stylesheet" type="text/css"的固定写法不可更改
3.<link>一般写在<head>内部
优先级：内联式>嵌入式>外部式
也可以将css样方式css样式由选择符和声明组成，声明又由属性和值组成
选择符：又称选择器，指明网页中要应用样式规则的元素
声明：在英文大括号里“{ }”中的就是声明
属性和值之间用英文冒号":"分割,中间有多条声明时，中间用英文分号“；”分隔
css选择器
1、标签选择器选择器{样式；}
例：(1)p{font-size:12px;//设置文字字号
color:red/#cccccc;//设置字体颜色
font-weight:bold;//设置字体加粗
} 这种方式是直接设置段落<p>标签的样式
(2)span{
color:red;
} 这种方式直接设置<span>标签的样式
2、类选择器
.类选择器名称{css样式代码；}
以英文点开头，选择器名称可以任意起名（不能为中文）
与之搭配的是class=“类选择器名称”
在需要用css样式的地方使用class，并引用类选择器名称才能使标签内的内容变为css样式
常用的标签有pspan等
例如：p class="选择器名称"
3、ID选择器
#选择器名称{css样式代码；}
以英文#号开头，引用时标签内设置id=“ID名称”
引用格式与类选择器相同
总结:2、3的相同点：可以应用于任何元素
2、3的不同点:(1)ID选择器只能在文档中使用一次，类选择器可以反复使用
(2)类选择器可以为一个元素设置多个样式，ID选择器是不可以的
4、子选择器
.类型名>标签名{css样式} 只针对第一个
5、后代选择器
.类型名 标签名{css样式} 在标签内的全部
6、通用选择器
* {css样式} 直接对整个页面中的所有标签进行样式更改
7、伪类选择符
a:hover{color:red;} hover:当鼠标触碰到引用此伪类的文字时发生变化
它允许给html不存在的标签（标签的某种状态）设置样式
8、分组选择符
h1,span{color:red}
相当于给两个标签赋予的相同的样式
样式的种类:
(1)font-weight:normal正规样式/bold加粗样式/xxpx像素大小
(2)color:#cccccc/red
2018年5月25日22:52:08
网友评论