css代码风格
样式大小写
h3{
color:颜色属性;
}
- 属性值前,冒号后面,保留一个空格
- 选择器(标签)和大括号中间保留空格
css选择器
- 作用:选择器(选择符)就是根据不同需求把不同的标签选出来的作用
- 分类:选择器分为基础选择器和复合选择器
- 基础选择器是由单个选择器组成
- 基础选择器又包括:标签选择器,id选择器和通配符选择器
标签选择器
标签选择器是用HTML标签名称最为选择器,按标签名称分类,为页面某一类标签指定同一css样式。
语法如下
标签名{
属性1:属性值1;
属性2:属性值2;
属性3:属性值3;
}
标签选择器可以把某一类标签全部选择出来,如所以的<div>和<span>标签,
优点在于快速为页面同类型同一设置样式。
缺点在于不能给其中一个修改样式,只能选择全部的当前标签。
类选择器
如果想要差异化选择不同的标签,单独选一个或者某几个标签,可以用类选择器 语法
类名{
属性1:属性值1;
...
}
如:
.yyds{
color:red;
}
结构需要用class属性来调用class类的意思
<li class="red">五条</li>
注意:
- 类选择器使用“.”进行标识,后面紧跟类名(自定义)
- 长名称或词组可以使用中横线为选择器命名。
- 不要使用纯数字,中午等命名。
类选择器-多类名
可给一个标签指定多个类名,从而达到更多选择的目的
<div class="类名1 类名2">名称</div>
<div class="red font20">名称</div>
- 在标签class属性中写多个类名
- 多个类名中间必须用空格隔开
- 可以把一些标签元素同样的样放到一个类里。
- 这些标签都可以调用这个公共的类,然后调用自己独有的类,从而节省css代码,统一修改也方便。
id选择器()
- id选择器可以为标有特定id的html元素指定特定的样式。
- html元素以id属性来设置id选择器,css中id选择器以“#”来定义。 语法
只能调用一次,别人切勿使用
#id{
属性1:属性值1;
}
例如:
#pink{
color: pink;
}
通配符选择器
在css中,通配符选择器使用“*”定义,他表示选择页面中所以元素(标签)
语法
*{
属性1:属性值1;
...
}
通配符选择器不需要调用,自动给所以元素使用样式