Css多级样式,css样式种类
在有多个css样式文件时 如有重复的class 优先级是如何决定的
这属于"多重样式(Multiple Styles)"
创新互联建站专业提供资阳移动机房服务,为用户提供五星数据中心、电信、双线接入解决方案,用户可自行在线购买资阳移动机房服务,并享受7*24小时金牌售后服务。
多重样式(Multiple Styles):如果外部样式、内部样式和内联样式同时应用于同一个元素,就是使多重样式的情况。
一般情况下,优先级如下:
(外部样式)External style sheet (内部样式)Internal style sheet (内联样式)Inline style,例如:
head
style type="text/css"
/* 内部样式 */
h3{color:green;}
/style
!-- 外部样式 style.css --
link rel="stylesheet" type="text/css" href="style.css"/
!-- 设置:h3{color:blue;} --
/head
body
h3测试!/h3
/body
在选择器的情况下:
如图:
解释:
1. 内联样式表的权值最高 1000;
2. ID 选择器的权值为 100
3. Class 类选择器的权值为 10
4. HTML 标签选择器的权值为 1
利用选择器的权值进行计算比较,示例如下:
html
head
style type="text/css"
#redP p {
/* 权值 = 100+1=101 */
color:#F00; /* 红色 */
}
#redP .red em {
/* 权值 = 100+10+1=111 */
color:#00F; /* 蓝色 */
}
#redP p span em {
/* 权值 = 100+1+1+1=103 */
color:#FF0;/*黄色*/
}
/style
/head
body
div id="redP"
p class="red"red
spanemem red/em/span
/p
pred/p
/div
/body
/html
结果:em 标签内的数据显示为蓝色。
CSS 优先级法则:
A 选择器都有一个权值,权值越大越优先;
B 当权值相等时,后出现的样式表设置要优于先出现的样式表设置;
C 创作者的规则高于浏览者:即网页编写者设置的CSS 样式的优先权高于浏览器所设置的样式;
D 继承的CSS 样式不如后来指定的CSS 样式;
E 在同一组属性设置中标有“!important”规则的优先级最大;示例如下:
html
head
style type="text/css"
#redP p{
/*两个color属性在同一组*/
color:#00f !important; /* 优先级最大 */
color:#f00;
}
/style
/head
body
div id="redP"
pcolor/p
pcolor/p
/div
/body
/html
如何给元素定义多个css类样式
假如有个div 如 div/div ;样式 class_1,class_2,class_3 ...
给div定义多个样式 div class="class_1 class_2 ..."/div,多个class用空格隔开
CSS 多重样式
例如
同时有
a {
...
}
body a {
...
}
将继承 body a 的样式
应该是指这个
CSS样式表存在形式有哪些,应用的侧重点分别是什么?
一共有三种 形式存在
第一种为标签样式,taglib为标签名,后面{}里面加属性,这种样式对页面内所有的标签名为taglibname的标签起作用。
第二种为css类样式,需要在HTML开始标签 后缀 class="name",name即类名,这类标签对HTML内所有后缀同样name的标签起作用 class="name" 可以设在多个开始标签后,表示这些标签具有同一类样式。
第三种为cssID样式,需要在HTML开始标签后缀 id="id",需要注意的是,ID样式的话,每一个name都是独立且不重复的,具有唯一性。
希望我的回答对你有帮助
怎么在一个CSS里同时设置多种样式
css里面顺序并没有明确的规定,都是可以的。 除非是定义同一个样式,比如:color,在一个类里面有两次color的话 就以后面的哪个为主。
本文标题:Css多级样式,css样式种类
文章网址:http://myzitong.com/article/dsdisho.html