css常用的网页布局样式属性.docVIP

网页布局常用的样式属性 Position Position有以下几个值：static，relative，absolute，fixed。 Static：静态定位。如果你没有设置position属性，那么缺省就是static。top，left，bottom，right等属性，在static的情况下是无效的，要使用这些属性，必须把position设置为其他三个值之一。 Relative：相对定位。元素将按照静态定位时的位置进行调整，在静态定位中分配给元素的空间仍然会分配给它，它两边的元素不会向它靠近来填充那个空间，但它们也不会从元素的新位置被挤走。 Absolute：绝对定位。元素将按照包含它的元素的位置进行调整，比如它嵌套在另一个绝对定位的元素中，那么就相对于那个元素定位。 Fixed：固定定位。元素将被设置在浏览器上一个固定位置上，不会随其他元素滚动。形象点说，上下拉动滚动条的时候，fixed的元素在屏幕上的位置不变。需要注意的是IE6并不支持此属性。 注意：很多网页都是居中的，这样，当对元素进行绝对定位的时候，在不同的分辨率下显示会有偏差，这时，我们可以通过类似下面的方法来处理： div style=position: relative; div style=position: absolute; top: 10px; left: 10px;/div /div div style=position: Fixed; top: 10px; left: 10px;/div /div //元素位置固定浏览器位置不变Float float 是 css 的定位属性 fload属性有四个可用的值：Left 和Right 分别浮动元素到各自的方向，None （默认的） 使元素不浮动，Inherit 将会从父级元素获取float值。 Float的用处float 属性定义元素在哪个方向浮动。以往这个属性总应用于图像，使文本围绕在图像周围，不过在 CSS 中，任何元素都可以浮动。浮动元素会生成一个块级框，而不论它本身是何种元素。 浮动非替换元素要指定一个明确的宽度；否则，它们会尽可能地窄。 注释: 假如在一行之上只有极少的空间可供浮动元素，那么这个元素会跳至下一行，这个过程会持续到某一行拥有足够的空间为止。 除了简单的在图片周围包围文字，浮动可用于创建全部网页布局。 /pink_study_note/blog/item/505ecc51485d9d658435246a.html margin(外边距) 定义margin 属性是用于在一个声明中设置四个外边距的所有属性的简写属性。 注释：允许使用负值。 继承性：No 说明这个简写属性设置一个元素所有外边距的宽度，或者设置各边上外边距的宽度。 块级元素的垂直相邻外边距会合并，而行内元素实际上不占上下外边距。行内元素的的左右外边距不会合并。同样地，浮动元素的外边距也不会合并。允许指定负的外边距值，不过使用时要小心。例子四个边距均为10px： h1 {margin: 10px}顶边距和底边距为10px，左边距和右边距是父元素宽度的2%： h1 {margin: 10px 2%}顶边距为10px，左边距和右边距是父元素宽度的2%，底边距是-10px： h1 {margin: 10px 2% -10px}顶边距为10px，右边距是父元素宽度的2%，底边距是-10px，而左边距由浏览器设置： h1 {margin: 10px 2% -10px auto} 可能的值设置针对边距的属性。margin-top margin-right margin-bottom margin-left 值可以是：百分比（基于父对象总高度或宽度的百分比） 长度值（定义一个固定的边距） auto（浏览器设定的值）。 默认值：未定义。 例子： htmlheadstyle type=text/cssp.margin {margin: 2cm 4cm 3cm 4cm}/style/head body p这个段落没有指定外边距。/p p class=margin这个段落带有指定的外边距。这个段落带有指定的外边距。这个段落带有指定的外边距。这个段落带有指定的外边距。这个段落带有指定的外边距。/p p这个段落没有指定外边距。/p /body /html border(边框) border（边框） border-left border-right border-bottom border-top border-style: dotted;(点线) dashed;(虚线) solid; double;(双线) groove;(槽线) ridge;(脊状) inset;(凹陷) outset;bord