CSS样式表
一：为什么要使用样式表？（CSS样式表对HTML标签进行控制，美化页面）
1.HTML标签的外观样式比较单一（默认字体黑色）
2.可以美化网页，使页面更漂亮
3.可以在多个网页中共享使用，提高工作效率
4.实现样式和页面分离，方便团队开发
DIV标签：容器标签 CSS控制页面是可直接对DIV 进行控制
二：样式表发的基本语法
<style type="text/css">
选择器{
属性：属性值
……
}
</style>
三：选择器的分类(1.标签选择器;2.类选择器;3.id选择器;)
1.标签选择器(标签名{属性：属性值})
例：<style type="text/css">
p{
属性：属性值
……
}
</style>
2.类选择器(.类名{属性：属性值}) 在代码标签中要定义类名称（<p class="r"> </p>）
例：<style type="text/css">
.className{
属性：属性值
……
}
</style>
3.id选择器(#id名称{属性：属性值}) 在代码标签中要定义id名称(<p id="e"></p>)
例：<style type="text/css">
#idName{
属性：属性值
……
}
</style>
4.选择器的集体声明
标签，#id名称，.类名称{属性：属性值……}
四：CSS的继承和嵌套
CSS继承是指：子标记会继承父标记的所有样式风格，并可以在父标记样式的风格的基础上加以修改，产生新的样式，而产生的新样式风格完全不会影响父标记
五：样式的分类（如下3种）
使用CSS控制页面的方法
1.行内样式：直接在标签中加入 属性定义
2.内嵌样式：
(1)CSS代码写在 <head>与</head>之间
(2)使用<style></style>标签进行声明
3.外部样式表
(1)链接外部样式表
<head>
<link href="文件的路径和名称" rel="指定相互关系是样式表（stylesheet）" type="链接的样式表示CSS（text/css）">
</head>
(2)导入外部样式表
<head>
<style type="text/css">
<!--
@import url(外部样式表CSS文件的路径和名称);
-->
</style>
</head>
(3)链接外部样式表与导入外部样式表的区别@import样式表：在HTML初始化时会被导入到HTML文件内<link>样式表：HTML标签需要样式时链接导入）
[1]:加载的顺序不同<link>样式表：同时加载 @import样式表：页面全部下载完后再加载
[2]:兼容性的差别@import样式表：CSS2.1提出的使用方式 一些老的浏览器不支持（如：IE4以下的浏览器）
[3]:使用DOM控制页面的样式的区别（页面使用JavaScript控制DOM改变页面样式时@import不支持,<link>属于XHTML标签@importCSS提供的方式）
六：样式的优先级（由以下 由左到右）
1.行内样式表--2.内嵌样式表--3.外部样式表((1)链接外部样式表--(2)导入外部样式表)
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
