1、CSS简介
- 层叠样式表,也称CSS样式表,是一种标记语言
- CSS最大价值:由HTML专注去做结构呈现,样式交给CSS ,即结构(HTML)与样式(CSS)相分离。
使用场景:美化HTML,布局网页
CSS语法规范:
- 由两个部分组成:选择器(给谁修改样式)+ 一条或者多条声明(修改什么样式)
- 选择器是用于指定CSS样式的HTML标签,花括号内是对该对象设置的具体样式
- 属性和属性值以“键值对”的形式出现
- 属性是对指定的对象设置的样式属性,例如字体大小、文本颜色等
- 属性和属性值之间用英文";" 分开
- 多个“键值对”之间用英文“:“进行区分
2、CSS基础选择器
作用:选择标签使用
分类:基础选择器和复合选择器
1、标签选择器
用HTML标签做选择器,把某一类标签全部选出
语法
2、类选择器
- 样式点定义,结构类定义,一个或多个,开发最常用
语法:
①类选择器使用"."(英文点号)进行标识,后面紧跟类名(自定义,我们自己命名的)。
②可以理解为给这个标签起了一个名字,来表示。
③长名称或词组可以使用中横线来为选择器命名。
④不要使用纯数字、中文等命名,尽量使用英文字母来表示。
⑤命名要有意义,尽量使别人-眼就知道这个类名的目的。
⑥命名规范:见附件( Web前端开发规范手册.doc )
多类名,一个标签class 属性可以添加多个类,每个类名之间要有空格
3、id选择器
- 样式"#"定义,结构id调用,别人不能使用
- id选择器和类选择器区别
- 类选择器( class )好比人的名字,一个人可以有多个名字,同时一个名字也可以被多个人使用。
- id 选择器好比人的身份证号码,全中国是唯一-的 ,不得重复。
- id 选择器和类选择器最大的不同在于使用次数上。
- 类选择器在修改样式中用的最多 ,id选择器-一般用于页面唯一性的元素上,经常和 JavaScript搭配使用。
4、通配符选择器
- 通配符" * " 表示选取页面所有元素
- 通配符选择器不需要调用,自动就给所有的元素使用样式
- 通常在css样式表开头取消所有元素的内外边距