1、行间样式表
写法:在标签中,写一个style的属性,比如:style="width: 200px;height: 100px;...;background: green;"。引号当中些相应的css样式。
缺点:不利于维护,不利于代码重用;
优点:优先级最高;
<div style="width: 200px;height: 100px;background: green;">111111</div>
2、内部样式表
写法:在header标签里,写一个style的标签;在标签中,通过选择器来控制样式;
选择器:
(1) 标签名选择器
写法:标签名 {
width: 200px;
height: 100px;
background: green;
}
(2) id选择器
写法:标签中设置ID属性;
#id名 {
......css样式;
}
温馨提示:id名应以英文字母开头;id名不能重复,唯一;
(3) class选择器
写法:标签中设置class属性;
.class名 {
......css样式;
}
温馨提示:class名应以英文字母开头;
选择器优先级:标签名选择器 < class选择器 < id选择器 < 行间样式;
缺点:不利于代码重用;
优点:加载速度快,不需要请求服务器;
3、外部样式表
写法:在header标签里,写一个link标签,用来关联一个css文件,在css文件中,通过选择器来控制样式;
温馨提示:<link rel="stylesheet" type="text/css" href="css文件路径">;
缺点:需要请求服务器;
优点:利于代码重用;