本文详细介绍了CSS中的内容区(content)、边框(border)、内边距(padding)和外边距(margin)的概念及设置方法。内容区定义元素文本内容的区域，边框用于装饰元素，内边距调整内容与边框的距离，外边距则影响元素间的间距。每个属性都有其特定的样式、颜色和宽度设置方式，且支持简写属性以方便快速定义。理解并掌握这些概念对于布局和美化网页至关重要。
1.内容区（content）元素中所有子元素的文本内容都在内容区中排列
width 设置内容区的宽度
heigth 设置内容区的高度
2.边框（border）元素设置边框
边框属于盒子边缘，边框里面属于盒子内部，处了边框都是盒子的外部
设置边框必须指定三个样式
边框的颜色、样式、大小
（1）border-width 默认值一般是1-3px
使用border-width可以分别指定四个边框的宽度
4个值 上 右 下 左
3个值 上 左右 下
2个值 上下 左右
1个值 上下左右
（2）.border-color 设置边框的颜色 默认值是黑色
和宽度一样，color也提供四个方向的样式，可以分别指定颜色 border-xxx-color
（3）.border-style 设置边框的样式
可选值：
none，默认值，没有边框
solid 实线
double 双线
dashed 虚线
dotted 点状边框
style也可以分别指定四个边的边框样式，规则和width一致，同时也可以提供border-xxx-style
四个样式，来分别设置四个边框
border
边框的简写样式，通过它可以同时设置四个边框的样式，宽度，颜色 而且没有任何的
顺序要求
border一指定就是同时指定四个边不能分别指定
border-top border-right border-bottom border-left
可以单独设置四个边的样式，规则和border一样，只不过它只对一个边生效
3.内边距（padding），指的是盒子的内容区域盒子边框之间的距离
一共有四个方向的内边距，可以通过：
padding-top
padding-bottom
padding-left
padding-right、
简写padding：；
可以跟多个值，规则跟border-width,border-color是一样的
内边距会影响盒子的可见框的大小，元素的背景会延伸到内边距，
盒子的大小有内容区、内边距和边框共同决定
4.外边距（margin）指的是当前盒子与其他盒子之间的距离，他不会影响到可见框的大小
而是会影响盒子的位置
盒子有四个方向的外边距：
margin-top
上外边距，设置一个正值，元素会向下移动
margin-right
默认情况下设置margin-right不会产生任何效果
margin-bottom
下外边距，设置一个正值，其下边的元素会向下移动，挤别人
margin-left
左外边距，设置一个正值，元素会向右移动
外边距同样可以使用简写属性margin，可以同时设置四个方向的外边距
规则和padding一样
950
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
