独立的CSS文件结构只包括各种选择器声明
选择器声明
标签选择器
标签名 {
属性名:属性值;
……
}
该标签选择器是针对HTML文档中所有同名标签进行修饰。
类选择器
.类名 {
属性名:属性值;
……
}
HTML文档中的标签,只要该标签的属性class等于类选择器声明中的类名,该选择器的修饰语法就可以应用于该标签。
ID选择器
#ID {
属性名:属性值;
……
}
HTML文档中的标签,只要该标签的属性id等于ID选择器声明中的ID,该选择器的修饰语法就可以应用于该标签。
ID选择器的应用与类选择器应用类似,不过在HTML文档中,标签的id属性是唯一的,所以ID选择器只能修饰该文档中的一个对应id的标签。
并集选择器
标签名, .类名, #ID {
属性名:属性值;
……
}
并集选择器声明中涉及的所有标签都可以应用该样式。
交集选择器
标签名.类名 或 标签名#ID{
属性名:属性值;
}
后代选择器
父标签 子标签 {
属性名:属性值;
}
修饰针对特定父标签嵌套的子标签样式
向HTML文档导入CSS文件的四种方法
1.行内式
也就是通过对一个标签的属性style进行设置,例如<p style="font-size:12px">内容</p>。不过这种方式不能体现出CSS语言的优势,结构与表现分离。
2.内部式
也就是在HTML文档中在标签style中进行声明,该style标签一般声明在<head>标签中。
<style type="text/css">
选择器声明语句;
</style>
3.外部式
有两种,
第一种是链接式,在标签<head>中添加标签<link rel="stylesheet" style="text/css" href="*.css" />,这种方式用的最多,先加载样式,再加载结构。
第二种是导入式,在标签<head>中添加标签<style type="text/css">
@import url("*.css")
</style> 先加载结构,后加载样式
网友评论