<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Document</title>
<style>
b{
font-size:25px;
}
#nurse{
/* 系统文件字体 C:/windows/Fonts/ */
font-family:华文彩云;
}
.girl2{
color:#ccc;
text-decoration:overline;
}
.girl{
/* 取消下划线 */
text-decoration:none;
}
#a{
color:red;
}
.b{
color:blue !important;
}
del{
color:green;
}
.father .jie{
color:purple;
}
.father > li{
font-size:30px;
}
.fen + li{
font-family:楷体;
}
.fen ~ li{
font-weight:bold;
}
</style>
</head>
<body>
<!--
选择器
1. 标签选择器
会获取页面所有的指定标签
2. ID 选择器
格式: #ID名 id='xxx'
ID不能重复, 不能多个
3. class选择器 类选择器
格式: .class名
class名可以重复, 可以多个
相同的对象,相同的属性,最近的一个样式起作用,前面都被覆盖掉 (就近原则)
注意点:
!important > id > class > 标签
4. 关联选择器
选择器1 选择器2 : 选择器1 后代
选择器1 > 选择器2 : 选择器1的下的儿子选择器2(不算孙子,以及更加后代)
兄弟元素1 + 兄弟元素2 (仅次于兄弟1的兄弟2)
所有的兄弟元素 用 ~ 连接 ( 找到兄弟之后的所有元素)
-->
<b>这年头,只有不伤手的立白, 哪有不分手的恋爱. 遇事看开点....</b>
<i id='nurse'>陪朋友去医院, 要抽血, 抽到一半的,护士打了个喷嚏,只见针头一下全扎进去了......</i>
<br />
<u class='girl girl2'>在火车站,看到一妹子后背拉链没拉好,俺上去帮她拉上去了,妹子回头就是一巴掌。好了,俺以为她不喜欢拉上去,又给她拉下来了,妹子回头又是两巴掌·····</u>
<del id='a' class='b'>怀才就跟怀孕一样, 时间就了才能让人看得出来</del>
<ul class='father'>
<li>求证: 1元=1分</li>
<li class='jie'>解:</li>
<ol>
<li>1元 = 100分</li>
<li class='fen'>=10分 * 10分</li>
<li>=1角 * 1角</li>
<li>=0.1元 * 0.1元</li>
<li>=0.01元</li>
<li>=1分</li>
</ol>
<li>证明完毕. 数学老湿哭了....因为,毫无破绽!</li>
<li>oh no !! shit!!</li>
</ul>
</body>
</html>
选择器!important > id > class > 标签,和关联选择器
最后编辑于 :
©著作权归作者所有,转载或内容合作请联系作者
- 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
- 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
- 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
推荐阅读更多精彩内容
- 两大重点 属性:通过属性的复杂叠加才能做出漂亮的网页。选择器:通过选择器找到对应的标签设置样式 一.标签选择器 标...
- 精读《唐诗三百首》033:刘长卿《逢雪宿芙蓉山主人》 文 | 谢小楼 01 逢雪宿芙蓉山主人刘长卿日暮苍山远,天寒...