Web前端之路H5/Web前端开发教程让前端飞

CSS 框模型 element、width、height、bor

2018-06-20  本文已影响12人  一Left一

CSS 框模型 (Box Model) 规定了元素框处理元素内容、内边距边框外边距 的方式。
元素框的最内部分是实际的内容,直接包围内容的是内边距。内边距呈现了元素的背景。内边距的边缘是边框。边框以外是外边距,外边距默认是透明的,因此不会遮挡其后的任何元素。

element : 元素。
padding : 内边距,也有资料将其翻译为填充。
border : 边框。
margin : 外边距,也有资料将其翻译为空白或空白边。

padding分别设置上、右、下、左内边距:
| padding | 简写属性。作用是在一个声明中设置元素的所内边距属性。
| padding-bottom | 设置元素的下内边距。
| padding-left | 设置元素的左内边距。
| padding-right | 设置元素的右内边距。
| padding-top | 设置元素的上内边距。
margin分别设置上、右、下、左外边距:
margin-top
margin-right
margin-bottom
margin-left

CSS border 围绕元素内容和内边据的一条或多条,属性允许你规定元素边框的样式、宽度和颜色。
border-top-style
border-right-style
border-bottom-style
border-left-style

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

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

width、height、padding、margin、border区别
width、height、padding、margin、border区别
上一篇 下一篇

猜你喜欢

热点阅读