css 常用属性、布局

文本

color //颜色名表示。如white、gold等。还可以rgb、rgba。a表示透明程度，[0,1]=[完全透明，不透明]。我喜欢rgb(255,0,128)。
text-decoration  //文本修饰，underline为下划线，line-through为删除线
text-align  //对齐方式，居中就是center。

字体

font-family //字体系列。我喜欢 Verdana。
font-size //大小。
font-style //italic 表示斜体
font-weight  //粗细。可以设置为bold。

背景

background-attachment，背景图片是否固定。scroll-滚动，fixed-固定。
background-color，背景色。
background-image，背景图片。background-image:url(abc.gif);
background-position，背景图片位置。xx px、xx%都可以。center、bottom也可以。

background-repeat，是否平铺。repeat、no-repeat、repeat-x、repeat-y。

使用上面的方法缺点是不能够自适应窗口，不能拉伸。推荐另一种实现：

<div id="Layer1" style="position:absolute; width:100%; height:100%; z-index:-1">    
<img src="img-1.jpg" height="100%" width="100%"/>    
</div> 

边框

border-style // solid是固体的意思，表示实线；oueset，像一个凸起的框
border-width //边框宽度。
边框默认是上下左右，所以可以使用border-top/bottom/left/right-style单独设定

外边距

margin: 1em;
外边距默认是上下左右，所以可以使用margin-top/bottom/left/right 单独设定

定位

position 属性值的含义：
static  //元素框占有自己的空间。
relative   //元素框偏移某个距离。不占有自己的空间。
absolute   //不占有自己的空间。

fixed //元素框的表现类似于将 position 设置为 absolute，不过其包含块是视窗本身。

z-index  //设置一个定位元素在z轴的位置，z轴为垂直于显示器的坐标轴。值越小表示离用户更远，可以为负数。

透明度

opacity：不透明度。0表示完全透明，1表示完全不透明。

媒体查询

@media 规则使你有能力在相同的样式表中，使用不同的样式规则来针对不同的媒介。也就是所说的响应式布局。

常用布局实现