前端学习Day4

一.css样式表的权重
1.比喻：
a.在公司：组长告诉你：本周加班7天。
在公司：老板告诉你：本周放假7天。
有冲突
b.在家：爷爷告诉你：抓紧娶媳妇
在家：爸爸告诉你：抓紧挣钱
有冲突
c.老板说：后天你休息
组长说：明天你工作
没有冲突
2.样式表的权重关系：
a.内联样式表的权重最大。
b.内部和外部样式的权重，和书写的前后顺序有关。（有冲突时，放在后面的会把放在前面的样式覆盖掉，没有冲突时，覆盖的只是相同属性的样式，不同属性的样式会继续执行。）
3.关键字：
!important 当前声明具有最高权重！直接加在属性值后 。
语法： eg: background:red!important;
二.css的层叠性（样式表权重体现）

答案：width:500px!important;
background:red;
height:400px;
border:10px solid yellow;
三.分析多个div的区分（每个版块都要加注释）
网页布局：先做上下排版，再做左右排版， 从外往里。
div网页布局：先分析上下共几个版块，就建几个div
四 .css选择符：就是给标签起名字
css语法： 选择符{属性：属性值;}
1：类型选择符（标签选择符）
所有的html标签可以直接当作选择符进行应用。
div\p\em\i\b\strong…
特点：能选中当前结构里面全部同名标签。
应用：想统一某一个标签样式的时候或者是清除某个标签默认样式的时候。
2：id选择符：相当于人的身份证号
语法： 起名字： <标签 id=“名称”></标签>
用名字写样式： #名称{ 属性:属性值 }
特点：唯一性！在同一个页面里面，一个id名只能用一次。
应用：来划分网页外围结构
3: 类选择符(class选择符)
语法: 其名称: <标签 class=“名称1 名称2 名称3 名称4…”></标签>
用类名写样式 .名称{属性:属性值;}
特点: a:一个元素可以有多个类名,类名可以重复出现
b:可以制定一类样式.
4: 群组选择符
语法:以逗号分隔的方式,把多个选择器组成一组,给整组添加样式.
选择符1,选择符2,选择符3,选择符4{ 属性:属性值; }
eg : #box,.con,h3,#wrap{ width:300px; }
5: 包含选择符(子代选择器\后代选择符) ( 通过父元素找子元素 )
语法: 父元素 子元素{ 属性:属性值; }
6: 伪类选择器:
a:link {color: red;} 未访问的链接状态
a:visited {color: green;} 已访问的链接状态
a:hover {color: blue;} 鼠标滑过链接状态
a:active {color: yellow;} 鼠标按下去时的状态
7：通配符 *{ }
* 选择页面中所有的元素！
*{ margin:0; 盒子外围间距清零
padding:0; 盒子内部的距离清零
}
8.起名规范：
a.尽量小写字母开头。
b.数组、字母、下划线、连字符的组合。
c.不能使用关键字命名 （所有的标签和属性都属于关键字）
d.命名尽量反应板块内容、或者反应结构(语义化)。
e.可以是拼音，但是不能出现汉字和特殊字符。
9.起名方法：
a：驼峰式命名法： newsLeft newsRight
b: 连字符命名： news-left news-right news-center
c: 下划线命名： news_left news_right news_center