一、网页中加css的方式有四种:
1、内联样式表:直接写在现有的标记中,如:<p style="color:red">这里文字是红色的</p>
2、嵌入式样式表:使用“<style></style>”标签嵌入到HTML文件的头部中<head>标记内,如:
<style type="text/css">
<!--
body{background:white;color:black;}
-->
</style>
<!-- -->用于当浏览器不支持样式表时,不会将样式表内容显示出来
3、外部链接式“样式表”:将样式表写在一个独立的.css文件中,然后在页面head区<head>标记内用<link>标签调用它,它主要用于实现表现与结构分离,如:
<link href="main.css" rel="stylesheet" type="text/css" />
4、导入式“样式表”:导入式样式表与链接式样式表的功能基本相同,只是语法和动作方式上略有不同,同样也将导入样式代码写在<head>标记内。
语法:
<style type="text/css">
@import url("basic.css");
</style>
二、css选择符类型
1、标签(类型)选择符:
就是针对HTML文档中的标签(哪些html标签应用哪些css样式)
如:p{font-size:12px;} div{background:blue;}
2、类选择符:可以自己定义样式,应用于一个或多个网页元素,类在网页中可以出现多次,用于重复的样式。类以英文开头,后面的名字自己定义,类定义后还需要在网页中加入class=类名称,加以调用。如:.warning{属性:值}
<p class="warning">......</p>
同时给某个元素应用多个类
<p class="a1 a2">.....</p>
3、ID选择符:与类基本相似,只是以英文”#“开头,因为ID具有唯一性,所以在网页中只能出现一次,用于定义只出现一次的样式。
如:#main{属性:值}
<p id="warning">......</p>
同事给某个元素应用多个类与ID
<p class="a1 a2" id="a6">......</p>
三、css样式的特点