CSS.3盒子
盒子
盒子大小
width,height
默认情况下，一个盒子大小刚好容纳其中的内容，并根据其中内容变化而变化。如果自定义合资的大小，就需要用到width和height属性。
指定盒子大小的最常用的方式是像素、百分数或em值。
宽度限制
min-width，max-width
min-width属性指定一个盒子在浏览器窗口较窄是可以显示的最小宽度
max-width属性指定一个盒子在浏览器窗口较宽时所能伸展的最大宽度
高度限制
min-height，max-height
与限制合资宽度的方式一样，你还可以对页面上的莫个盒子进行高度限制。
高度限制可以利用min-height和max-height属性来完成。
内容溢出
overflow
hidden:把一处合资空间的内容进行隐藏
scroll:在盒子上添加一个滚动条
边框宽度
border-width
border-width 属性用来控制边框的宽度。该属性可以是像素值，
也和以选择以下值之一:
thin
medium
thick
该属性值不可以使用百分数。
可以通过下面4种属性分别对各个边框大小进行控制:
border-top-width
border-right-width
border-bottom-width
border-left-width
边框样式
border-style
solid:一条实线
dotted:一串方形点
dashed一条虚线
double:两条实现
groove:显示为雕入页面的效果
ridge:显示为在页面上凸起的效果
inset:显示为嵌入页面的效果
outset:突出屏幕
hidden/none:不显示任何边框
可以利用下面的属性对各个边框的样式单独进行设置:
border-top-style
border-left-style
border-right-style
border-bottom-style
边框颜色
border-color
可以控制以下单独一个盒子不同方向上的边框颜色:
border-top-color
border-left-color
border-right-color
border-bottom-color
快捷方式
border
内边距
padding :制定元素的内容与元素边框之间保持多大的空隙
可使用以下属性分别制定各个方向上的内边距:
padding-top
padding-right
padding-bottom
padding-left
外边距
margin :控制盒子之间的空隙
可使用以下属性分别制定各个方向上的外边距:
margin -top
margin -right
margin -bottom
margin -left
内联元素与块级元素的转换
display
inline:使一个内联元素表现的像一个块级元素
block:使一个块级元素表现的像一个内联元素
inline-block:
none:隐藏元素
盒子的隐藏
visibility
hidden:隐藏元素
visible:显示元素
边框图像
boeder-image
stretch:伸展图片
repeat:重复图片
roud
盒子的投影
box-shadow
圆角
border-radius
椭圆形
border-radius
