目录
1.选择器的优先级
/*
* 当使用不同的选择器，选中同一个元素时并且设置相同的样式时，
* 这时样式之间产生了冲突，最终到底采用哪个选择器定义的样式，由选择器的优先级（权重）决定
* 优先级高的优先显示。
*
* 优先级的规则
* 内联样式 ， 优先级 1000
* id选择器，优先级 100
* 类和伪类， 优先级 10
* 元素选择器，优先级 1
* 通配* ， 优先级 0
* 继承的样式，没有优先级
*
* 当选择器中包含多种选择器时，需要将多种选择器的优先级相加然后在比较，
* 但是注意，选择器优先级计算不会超过他的最大的数量级，如果选择器的优先级一样，
* 则使用靠后的样式。
*
* 并集选择器的优先级是单独计算
* div , p , #p1 , .hello{}
*
* 可以在样式的最后，添加一个!important，则此时该样式将会获得一个最高的优先级，
* 将会优先于所有的样式显示甚至超过内联样式，但是在开发中尽量避免使用!important
*
*/
/*
* 涉及到a的伪类一共有四个：
* :link
* :visited
* :hover
* :active
* 而这四个选择器的优先级是一样的。
*/2.文本标签
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--
em和strong
- 这两个标签都表示一个强调的内容，
em主要表示语气上的强调,em在浏览器中默认使用斜体显示
strong表示强调的内容，比em更强烈，默认使用粗体显示
-->
<p>
今天天气<em>真不错</em>！
</p>
<p>
<strong>
注意：如果你不认真上课，你就找不到好工作！
</strong>
</p>
<!--
i标签中的内容会以斜体显示
b标签中的内容会以加粗显示
h5规范中规定，对于不需要着重的内容而是单纯的加粗或者是斜体，
就可以使用b和i标签
-->
<p>
<i>我是i标签中的内容</i>
<b>我是b标签中的内容</b>
</p>
<!--
small标签中的内容会比他的父元素中的文字要小一些
在h5中使用small标签来表示一些细则一类的内容
比如：合同中小字，网站的版权声明都可以放到small
-->
<p>
我是p标签中的内容<small>我是small标签中的内容</small>
</p>
<!--
网页中所有的加书名号的内容都可以使用cite标签，表示参考的内容，
比如：书名 歌名 话剧名 电影名 。。。
-->
<p>
<cite>《论语》</cite>是最喜欢的一般的书
</p>
<!--
q标签表示一个短的引用（行内引用）
q标签引用的内容，浏览器会默认加上引号
blockquote标签表示一个长引用（块级引用）
-->
<p>
子曰:<q>学而时习之不亦说乎！</q>
</p>
<div>
子曰:
<blockquote>
有朋自远方来，乐呵乐呵！
</blockquote>
</div>
<!--
使用sup标签来设置一个上标
-->
<p>2<sup>2</sup></p>
<p>赵薇<sup><a href="#">[1]</a></sup></p>
<!--
sub标签用来表示一个下标
-->
<p>H<sub>2</sub>O</p>
<!--
使用del标签来表示一个删除的内容
del标签中的内容，会自动添加删除线
-->
<p>
<del>17.75</del> <br />
15.54 <br />
</p>
<!--
ins表示一个插入的内容
ins中的的内容，会自动添加下划线
-->
<p>
我们的老师真<ins>好啊</ins>！
</p>
<!--
需要页面中直接编写一些代码
pre是一个预格式标签，会将代码中的格式保存，不会忽略多个空格
code专门用来表示代码
我们一般结合使用pre和code来表示一段代码
-->
<pre>
<code>
window.onload = function(){
alert("Hello World");
};
</code>
</pre>
</body>
</html>
3. 列表
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
/*
去掉项目符号
* */
/*ul{
list-style: none;
}*/
</style>
</head>
<body>
<!--
列表就相当于去超市购物时的那个购物清单，
在HTML也可以创建列表，在网页中一共有三种列表：
1.无序列表
2.有序列表
3.定义列表
-->
<!--
无序列表
- 使用ul标签来创建一个无序列表
- 使用li在ul中创建一个一个的列表项，
一个li就是一个列表项
通过type属性可以修改无序列表的项目符号
可选值：
disc，默认值，实心的圆点
square，实心的方块
circle，空心的圆
注意：默认的项目符号我们一般都不使用！！
如果需要设置项目符号，则可以采用为li设置背景图片的方式来设置
ul和li都是块元素
-->
<ul>
<li>西门大官人</li>
<li>柴大官人</li>
<li>许大官人</li>
<li>唐僧大官人</li>
</ul>
<!--
有序列表和无序列表类似，只不过它使用ol来代替ul
有序列表使用有序的序号作为项目符号
type属性，可以指定序号的类型
可选值：1，默认值，使用阿拉伯数字
a/A 采用小写或大写字母作为序号
i/I 采用小写或大写的罗马数字作为序号
ol也是块元素
-->
<ol type="I">
<li>结构</li>
<li>表现</li>
<li>行为</li>
</ol>
<!--
列表之间都是可以互相嵌套，可以在无序列表中放个有序列表
也可以在有序列表中放一个无序列表
-->
<p>菜谱</p>
<ul>
<li>
鱼香肉丝
<ol>
<li>鱼</li>
<li>香</li>
<li>肉丝</li>
</ol>
</li>
<li>
宫保鸡丁
<ul>
<li>宫保</li>
<li>鸡丁</li>
</ul>
</li>
<li>青椒肉丝</li>
</ul>
</body>
</html>
4.定义列表
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<!--
定义列表用来对一些词汇或内容进行定义
使用dl来创建一个定义列表
dl中有两个子标签
dt ： 被定义的内容
dd ： 对定义内容的描述
同样dl和ul和ol之间都可以互相嵌套
-->
<dl>
<dt>武松</dt>
<dd>景阳冈打虎英雄，战斗力99</dd>
<dd>后打死西门庆，投奔梁山</dd>
<dt>武大</dt>
<dd>著名餐饮企业家，战斗力0</dd>
</dl>
</body>
</html>
8009
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
