html+css学习笔记007-样式优先级0外链css样式表
2018-05-24 本文已影响19人
Mr柳上原
Author：Mr.柳上原
- 付出不亚于任何的努力
- 愿我们所有的努力，都不会被生活辜负
- 不忘初心，方得始终
心比天高
手如残废
刚学习前端的时候理解较快
老师布置的课后作业都能飞快完成
于是蜜汁自信
觉得前端不过如此
越深入的去学习
才发现自己是多么的井底之蛙
<!DOCTYPE html> <!-- 文档类型：标准html文档 -->
<html lang='en'> <!-- html根标签 翻译文字：英文 -->
<head> <!-- 网页头部 -->
<meat charset='UTF-8'/> <!-- 网页字符编码 -->
<meat name='Keywords' content='关键词1,关键词2'/>
<meat name='Description' content='网站说明'/>
<meat name='Author' content='作者'/>
<title>前端59期学员作业</title> <!-- 网页标题 -->
<link rel='stylesheet' type='text/css' href='css/css1.css' /> <!-- 外链样式表 -->
<style type='text/css'> /*内部样式表*/
/* 选择器优先级 */
*{ }
div{ }
.box{ }
#box{ } /* * < 元素名 < class < id 选择范围越广，优先级越低 */
.box{ }
.box{ } /* 选择器相同的时候，后面的样式覆盖前面 */
#box ul .li{ }
.box #ul .li{ } /* 复杂情况下，id选择器个数 > class选择器个数 > 元素名选择器个数 */
/* 选择器使用原则：准确的选中元素，利于维护 */
/* 样式表优先级 */
外链样式表 < 内嵌样式表 < 行间样式表 /* 就近原则 */
.class{... !important} /* 增加权重，高于行间样式表 */
</style>
</head>
<body> <!-- 网页主干：可视化区域 -->
<div id='box' class='box'>
<ul id='ul' class='ul'>
<li id='li' class='li'></li>
<li></li>
</ul>
</div>
</body>
</html>
