09---HTML+CSS---前阶段小结

一、网页导航：

列表	用途
ul	使用较多（横向/纵向）
ol	使用较少
dl	网页底部

列表一般重复较多，此时先写一个，写好之后其他的复制就可以。先写好结构，再去写样式。

注意：li是块级的，所以会适应父级的大小。

二、关于继承：

目的：为了简化重复书写。

能继承的较少，基本是文字属性和文本属性。

css中可以和不可以继承的属性：

http://www.cnblogs.com/thislbq/p/5882105.html

和

http://www.cnblogs.com/cuteblackcat/p/6675890.html

三、 关于a标签：

默认颜色是蓝色，且有下划线。关于a标签的颜色，不会继承父元素的，要单独设定在a标签的样式中。

四、 两个行内元素错位：

vertical-align:middle;

五、 关于定位：

1、能用浮动就不用定位。（除非迫不得已）
2、结合js使用定位。
3、带位移的基本使用定位来写。
4、二级菜单。

六、 类名组合：

class="pos pos1"
class="pos pos2"
class="pos pos3"
class="pos pos4"
class="pos pos5"

.pos{共同属性}
.pos1{单独设定的属性}
.pos2{单独设定的属性}
.pos3{单独设定的属性}
.pos4{单独设定的属性}
.pos5{单独设定的属性}

起名字要见名之意。

关于编辑器sublime：

安装Emmet插件，可以简写css样式。

七、 路径：

绝对路径：

E:\Java\jdk1.8.0_131

相对路径：

../../目标图片.png

往外越一级就../

当前目录就./

八、display

值	描述
block	此元素将显示为块级元素。weight height有效
inline	默认。此元素会被显示为内联元素。weight height无效
inline-block	行内块元素（行内块级）。浮动元素的特征。可在一行共存，又能设置宽高。

九、text-shadow凹凸文字

值	描述
h-shadow	必需。水平阴影的位置。允许负值。
v-shadow	必需。垂直阴影的位置。允许负值。
blur	可选。模糊的距离。
color	可选。阴影的颜色。

语法：

text-shadow: h-shadow v-shadow (blur) color;

凹：

text-shadow: -1px 0 #333,
              0 -1px #333,
              1px 0 #D8E0E0,
              0 1px #D8E0E0;

凸：

text-shadow: -1px 0 rgb(192,203,217),
              0 -1px rgb(192,203,217),
              1px 0 rgb(254,231,227),
              0 1px rgb(254,231,227);

一般都用-1 -2

网页显示：