盒模型、内外边距和边框

盒模型：内容、内边距、边框、外边距

如图：

边框颜色：

border-color：blue || rgb(255,0,0) || #fff000 || transparent（透明，默认值不经常使用可不记）

边框厚度：

border-width：thin || medium || thick || 1em、2px、0.1%

（thin:细边框，medium：中等边框，thick：粗边框，*使用“border-width”属性需先设置：border-style）

边框厚度简写可为全部边框设置宽度，也能够单独的设置各边的边框宽度

例1：设置全部边框宽度

bord-width: medium；（全部边框厚度都是中等）

 例2：设置4个边不一样宽度

bord-width: thin medium thick 2px；（上边框：细，右边框：中等，下边框：粗，左边框：2px）

例3：设置3个框宽度

bord-width:thin medium thick；（上边框：细，右边框和左边框：中等，下边框：粗）

 例2：设置4个边不一样宽度

bord-width: thin medium;（上边框和下边框：细，右边框和左边框：中等）

边框样式：

border-style：none || hidden || dotted || dashed || solid || double || groove || ridge || inset || outset

（none：无边框，hidden：与“none”相同，用于表时用于解决边框冲突，dotted：点状边框，大多数浏览器呈现实线，dashed：虚线，大多数浏览器呈现实线，solid：实线，double：双线，groove：3D凹槽，ridge：3D垄状边框，inset：3Dinset边框，outset：3Doutset边框

*经常使用：none、dashed、solid ，其他可不记）

如下全部边框设置实例：

边框圆角：

border-radius：1px || 3em || 10%

例：

内边距：

padding：10px || 1em ||20% || auto

外边距：

margin：10px || 1em ||20% || auto

*以上属性均可指定一个边设置样式