css第一节第二天

1.1CSS语法

选择符

属性声明

括号

换行不敏感、空格不敏感

案例：

div { color:red;}

p{font-size:14px;color:blue;}

h1 {

width: 20px;

height:200px;

}

1.2CSS简单属性

width：设置宽度，单位px像素

height：高度

color：前景色，也就是文字的颜色

background-color：背景色。

font-size:字体的大小。

案例：

1.3CSS的注释格式： /* 注释内容  */

2.1CSS选择器综述

所有标签选择器 * {}（通配符选择器）

标签选择器  p {}    div {}

ID选择器    #head {}

类选择器  .head {}

层级选择器（复合选择器）

分组选择器

属性选择器

子元素选择器

相邻兄弟选择器

伪类选择器

伪元素选择器

2.2通配符选择器

通配符选择器用“*”号表示，他是所有选择器中作用范围最广的，能匹配页面中所有的元素。
例如下面的代码，使用通配符选择器定义CSS样式，清除所有HTML标记的默认边距。

通配符的穿透力很强，优先级高于继承的样式，会覆盖继承的样式。一般不用。

2.3标签选择器

2.4 ID选择器

2.4.1 -HTML标签都有公共ID属性，而且整个页面唯一

-id一般用于css的选择器和js的钩子

-id选择器使用“#”进行标识，后面紧跟id名

2.4.2ID选择器命名规范

1）只允许出现字母（大小写均可，严格区分） 、下划线、数字。

也就是说，id=”laoHe”和 id=”laohe”不冲突

2) 只允许以字母开头

3) 命名没有长度限制，可以是 1 个字母，也可以是很多个。不过不建议太长。

4) 不允许出现标签名（不是硬性规定，是有工作经验的表现

注意：

id选择器的优先级非常高，所以确定在整个页面内唯一出现时，才可以使用id选择器，不然因为优先级问题在后续维护中不能很好进行修改更新。