当前位置: 移动技术网 > IT编程>网页制作>CSS > css框模型

css框模型

2018年02月05日  | 移动技术网IT编程  | 我要评论

此间的少年广播剧,明升19119澳门公司,难耐老公狂野

css框模型

(一)内边距

padding 内边距
即边框和内容之间的空白区域
h1 {padding: 10px 0.25em 2ex 20%;}
四个值这种则分别是按照上,右,下,左的顺序设置内边距

单边内边距属性
padding-top
padding-right
padding-bottom
padding-left

(二)边框

每个边框有3个方面:宽度,样式,颜色
边框的样式:
border-style的值
none 无边框
hidden 无边框
dotted 点状边框
dashed 虚线
solid 实线
double 双线

定义单边样式:
border-top-style
border-right-style
border-bottom-style
border-left-style

边框宽度
border-width
两种方法:指定长度值或者使用关键字(thin medium thick)

定义单边宽度
p {border-style: solid; border-width: 15px 5px 15px 5px;}
分别从上右下左来设置各边框的宽度
border-top-width
border-right-width
border-bottom-width
border-left-width

边框的颜色
border-color,一次性可以接受最多4个颜色值

定义单边颜色
border-top-color
border-right-color
border-bottom-color
border-left-color

透明边框
border-color: transparent;

(三)外边距 margin

外边距指定少于 4 个值时,规则如下:
如果缺少左外边距的值,则使用右外边距的值。
如果缺少下外边距的值,则使用上外边距的值。
如果缺少右外边距的值,则使用上外边距的值。

单边外边距属性
margin-top
margin-right
margin-bottom
margin-left

(四)外边距合并

当两个垂直外边距相遇时,他们会合并成一个外边距,取两者中的最大者
1)一个元素出现在另一个元素之上
2)一个元素包含在另一个元素之中
3)空元素上下外边距合并

如对本文有疑问,请在下面进行留言讨论,广大热心网友会与你互动!! 点击进行留言回复

相关文章:

验证码:
移动技术网