css定位、布局、外边距、内边距、边框概述.pptVIP

* 例子： .test {padding: 10px;border: 1px solid #000;} div class=test注意我离4条边框线的距离/div * 四个属性 padding-top： 单独设置对象顶边的内边距 padding-right： 单独设置对象右边的内边距 padding-bottom： 单独设置对象底边的内边距 padding-left： 单独设置对象左边的内边距 边框 Border 设置对象边框的特性 基本说明 设置边框的特性，包括宽度、样式、颜色 * border 复合属性 设置对象边框的特性 语法：border：line-width || line-style || color line-width：设置或检索对象边框宽度。 line-style：设置或检索对象边框样式。 color：设置或检索对象边框颜色。 * 例子： .test {border: 5px solid #000;} .test2 {border: 5px solid;color: #f00;} div class=test定义边框特性/div div class=test2边框颜色默认使用文本颜色/div * border-width 单独设置对象的边框宽度 语法：border-width：line-width{1,4} 一个参数应用于四边，两个分别应用于上下、左右，三个分别应用于上、左右、下，四个顺序上、右、下、左 * 例子： .test {border-width: 2px;border-style:solid;} .test2 {border-width: 5px;border-style:solid;} div class=test例1/div div class=test2例2/div * border-style 设置对象的边框样式 语法：border-style：line-style{1,4} * 例子： p.none {border-style:none;} p.dotted {border-style:dotted;} p.dashed {border-style:dashed;} p.solid {border-style:solid;} p class=none无边框。/p p class=dotted虚线边框。/p p class=dashed虚线边框。/p p class=solid实线边框。/p * border-color 设置对象的边框颜色 语法：border-color：color{1,4} * 例子： p.one{border-style:solid;border-color:#0000ff;} p.two{border-style:solid;border-color:#ff0000 #0000ff;} p class=oneOne-colored border!/p p class=twoTwo-colored border!/p * 四个属性 border-top： 复合属性,单独设置对象顶部边框的特性。 border-right： 复合属性,单独设置对象右边边框的特性。 border-bottom： 复合属性,单独设置对象底部边框的特性。 border-left： 复合属性,单独设置对象左边边框的特性。 * 语法： border-top：line-width || line-style || color border-right、border-bottom、border-left语法相同 各自三个属性（以border-top为例，其他对应设置） border-top-width： 设置顶部边框宽度 border-top-style： 设置顶部边框样式 border-top-color 设置顶部边框颜色 人有了知识，就会具备各种分析能力， 明辨是非的能力。 所以我们要勤恳读书，广泛阅读， 古人说“书中自有黄金屋。 ”通过阅读科技书籍，我们能丰富知识， 培养逻辑思维能力； 通过阅读文学作品，我们能提高文学鉴赏水平， 培养文学情趣； 通过阅读报刊，我们能增长见识，扩大自己的知识面。 有许多书籍还能培养我们的道德情操， 给我们巨大的精神力量， 鼓舞我们前进。 * 定位 Positioning 决定对象的定位方式 基本说明 定位的方式由position的值来确定 叠级别通过z-index属性定义，即元素与元素之间的重叠等级，当position的值为非static时使用 定义了position为非static的元素可使用属性top、right、bottom、left对元素进行位移 clip用于绝对定位元素，剪裁元素 position position