盒子模型知识

1》网页上的每一个标签都是一个盒子

2》content:内容（文字和图片）

height:元素高度

max-height:元素最大高度

min-width:元素最大宽度

min-width:元素最小宽度

width:元素宽度

3》padding:内边距（添加的辅料）

padding-top:上内边距

padding-right:右内边距

padding-left:左内边距

padding-bottom:下内边距

注意内边距填充：

案列1：padding:10px,5px,15px,20px(上,右,左,下)

案列2：padding:10px,5px,15px(上：10,右左：5,下：15)

案列3：padding:10px,5px(上下：10,右左：5)

案列4：padding:10px(上,右,左,下，边距都是10)

4》border:边框（盒子本身）

p{

border:5px solid red；(宽度、样式、颜色)

}

属性：border-width、border-style、border-color

设置边框圆角：border-radius

5》margin:外边距（盒子之间的空隙）

margin-top:上外边距

margin-right:右外边距

margin-left:左外边距

margin-bottom:下外边距

注意:

1》行内标签和行内-块级标签居中使用margin

2》块级标签居中使用text-algin

3》行内标签、块级标签和行内-块级标签都可以使用line-height

 

转载于:https://www.cnblogs.com/yuhao309/p/5503155.html