x今天的DIV+CSS基础内容：1、CSS 中边框border的使用，2、CSS 中边界padding和margin的使用。这2个基本在写CSS的时候都会用到，而且IE6的兼容性问题也大部分时候都是这2个因素导致。

一、CSS 中边框border的使用

属性名称属性值说明
border-color  十六进制可依序设置上，右，下，左线颜色

英文名称border-color:red(四边均为红色)

三原色border-color:red green(上下为红色，左右为绿色)


border-color:red green blue(上为红色、左右为绿色、下为蓝色)


border-color:red green blue yellow(上右下左分别为红绿蓝黄)
border-stylenone不显示边线

dotted点线

dashed虚线

solid实线

double双线
border-width长度border-width:0.2cm 0.3cm 0.4cm 0.5cm;


border-width:1 2 3 4;




简化方案：border:形态 长度 颜色
例如：

  1. border:1px solid black;

复制代码

二、CSS 中边界padding和margin的使用

padding属性名称属性值说明
padding-bottom长度/百分比元件下端边线的空隙
padding-left长度/百分比元件左端边线的空隙
padding-right长度/百分比元件右端边线的空隙
padding-top长度/百分比元件上端边线的空隙



简易写法：

  1. padding:10px;

  2. padding:2px 4px;

  3. padding:2px 6px 10px;

  4. padding:1px 2px 3px 4px;

复制代码
属性名称属性值说明
margin-bottomauto自动调整空隙

长度/百分比设置下端空隙
margin-leftauto自动调整空隙

长度/百分比设置左端空隙
margin-rightauto  自动调整空隙

长度/百分比设置右端空隙
margin-topauto自动调整空隙

长度/百分比设置上端空隙



简化方案：

  1. margin:2px 4px

  2. margin:2px 6px 10px

  3. margin:1px 2px 3px 4px

复制代码

常用网页顶格设置：

  1. margin:0;

复制代码

模板中常用的居中：

  1. margin:0 auto;

复制代码



很多同学都想做模板，但htm和CSS都会的不多，可以看看我们htm和CSS的知识，做Discuz模板的时候才会得心应手，坚持学习，相信一定会成功。


本贴采集于网上