<link rel="stylesheet"type="text/css"href="yangshi.css"/>
<style>
a{color:red;font-size:18px}
.p1{color:blue;font-size:36px}
#o1{color:green;font-size:72px}
</style>
</head>
<body>
<a href="#">dsds</a>
<a href="#"class="p1">dsds</a><!--看出class大于默认的-->
<a href="#"id="o1">dsds</a>
<a href="#"style="color:yellow;font-size:148px">dsds</a>
<!--以上是样式的不同格式,下面比较优先级-->
<a href="#"class="p1"id="o1">dsds</a><!--看出id>class-->
<a href="#"id="o1"style="color:yellow;font-size:148px">dsds</a><!--看出内置样式在以上样式中优先级最大,下面将他们和外部链接的比较-->
</body>
显示效果
将
<link rel="stylesheet"type="text/css"href="yangshi.css"/>
注释掉显示结果和上面的一样。
下面将
<style>
a{color:red;font-size:18px}
.p1{color:blue;font-size:36px}
#o1{color:green;font-size:72px}
</style>
注释掉
显示结果
总结就是大体上样式的优先级别是内置style="">id>class>默认>外链接的,对于默认的和外链接的class进行比较,显示的结果为2者皆不是,和id我就不比较了。