1CSS概念:
css(cascading style sheet)汉译为层叠样式表,是用于控制网页样式
WEB标准中的表现标准语言,在网页中主要对网页信息的显示进行控制。目前推荐遵循的是w3C发布的CSS3.8版本;
用来表现HTML或者XHTAL等样式文件的计算机语言。1998年5月21日由w3C正式推出的css2.e
2.HTML+CSS
弥补html语言的不足,缩减页面代码,提高访问速度;
代码减少,页面文件就会小,占用网络带宽就少,客户端打开速度就快,用户体验就会更好结构清晰,有利于seo优化
有利于搜索引擎优化
缩短改版时间
对网站的重构有很好的支持
3.CSS的语法
对网站的重构有很好的支持
声明包括:属性和属性值
选择符{
属性1 : 属性值1 属性值2 属性值3; 属性2 : 属性值;
}
CSS样式表
1:内部样式表
语法:
<style type="text/ css">
css语句
</ style>
注:使用style标记创建样式时,最好将该标记写在<head></head>;
2:外部样式表
(1)语法:<link rel="stylesheet" type="text/css" href="目标文件的路径及文件名全称"/>
说明:使用link元素导入外部样式表时,需将该元素写在文档头部,即<head>与</head>之间。
rel:用于定义文档关联,表示关联样式表;
type:定义文档类型;
外部样式:1:生成一个独立的html文件,后缀为.html2:生成一个独立的css文件,后缀为.css3:关联连个文件,在htm1页面中的head标签中添加,<link rel="stylesheet" type="text/ css" href= "css地址”/>
(2)、导入外部样式表
<style type="text/ css">
@import url("目标文件的路径及文件名全称");
< / style>了解 即可 不常用
link 和@import的区别: 1:本质区别,link时标签,@import是css提供的一种写法2:加载顺序差别,link同时加载,import后加载3:兼容性差别,link没有兼容问题,@import不兼容低版本ie4:能否被js控制,link能被js控制,@import 不能被js控制
CSS样式表的权重关系
1)内联样式表的优先级别最高
2)内部样式表与外部样式表的优先级和书写的顺序有关,后书写的优先级别高。
3)同在一个样式表中的优先级和书写的顺序也有关,后书写的优先级别高。(被覆盖的只是相同属性的样式)
选择器:选中指定的元素
类型选择器(元素选择器标签选择器):div pa img span i em....
类选择器(class选择器):
<标签class="mz"></标签>
.mz{} 【注】
在同一个页面中可以有多个相同的值在同一个class中可以有多个值
具有重用性,通常用来写样式
id选择器:
<标签id="mz"></标签>
#mz{} 【注】在同一个页面中不能出现对此相同的值在同一个id中只有一个值
具有唯一性,一般不用来谢样式
*通配符:通通匹配,匹配所有的元素
*{margin:0;padding:0;}
群组选择器:
选择器1,选择器2,选择器3}匹配123,共匹配了3个
最高权重 !important