盒子模型

1.盒子的宽高属性:

     width       height

盒子的总宽度=width+左右内边距之和(padding)+左右边框宽度之和(border)+左右外边距之和 (margin)

盒子的总高度=width+上下内边距之和(padding)+上下边框宽度之和(border)+上下外边距之和 (margin)  

2.边框属性:

none:没有边框

solid:边框为单实线

dashed:边框为虚线

dotted:边框 为点线

double:边框为双实线 

3.综合设置边框:

边框宽度(border-width)     样式(style)     颜色(color)

例如:p{ border-top:1px  solid   #000;}

4.边框(border)   内边距(padding)   外边距(margin) 都具有相似地属性;例如:width    color   style 

5.内边距属性(padding)    外边距属性(margin)        常用单位:px

padding:不允许为负值          margin:可以为负值

6     .背景颜色(background-color)

        背景图像(background-repeat):no-repeat:不重复,不平铺。                css背景图像可以通过background-image      属性值url

                  repeat-x:横向平铺

                  repeat-y:竖向平铺

7.背景图像的位置(background-position)

例如:background-pasition:left  bottom;    图像靠左下角。

原文地址:https://www.cnblogs.com/zhang1997/p/7477364.html