10.css盒子模型-边框常用写法及简写

html-css019

10.css盒子模型-边框常用写法及简写,第1张

为元素设置边框

要为一个元素设置边框必须指定三个样式

border-width:边框的宽度

border-color:边框颜色

border-style:边框的样式

和宽度一样,color也提供四个方向的样式,可以分别指定颜色

可选值:

style也可以分别指定四个边的边框样式,规则和width一致,

同时它也提供border-xxx-style四个样式,来分别设置四个边

示例:

边框的简写样式,通过它可以同时设置四个边框的样式,宽度,颜色

而且没有任何的顺序要求

border一指定就是同时指定四个边不能分别指定

border-top border-right border-bottom border-left

可以单独设置四个边的样式,规则和border一样,只不过它只对一个边生效

直接用css属性值设置边线:border即可,还可以单独设置border-left,right,bottom,top。

用ccs3中的盒阴影设置,是一种固定写法: box-shadow:1px 1px red,inset 1px 1px red.