设置盒子模型的实线,盒子模型内边距
怎样在网页盒子模型的内容中做一条有颜色的线条
1、打开浏览器，搜索盒子模型，进入界面，选择内容制作。
2、选择工具，选择线条，选择线条粗细，进行勾勒，选中所制作的线条，进行颜色填充即可。
盒子模型边框外边距
盒子模型是由 margin + border + padding + 网页元素（content）
?div{
? ? ? ? ? ? width: 200px;
? ? ? ? ? ? height: 200px;
? ? ? ? ? ? ?border-color:red;}
?border-top-color: red;设置上边框的颜色
?border-right-color:red;设置右边框的颜色
border-bottom-color:red;设置下边框的颜色
border-left-color: red;设置左边框的颜色
border-color:red yellow；第一个值red表示上下边框的颜色 第二个值表示左右边框的颜色
?border-color:red green blue;第一个值表示上边框的颜色 第二个值表示左右边框的颜色 第三个值表示下边框的颜色
?border-color:red green blue yellow;按照顺时针的顺序 第一个值表示上边框的颜色 第二个值表示右边框的颜色，第三个值表示下边框的颜色 第四个值表示左边框的颜色
★单独设置颜色或者边框的粗细的时候 必须要把border-style设置好
?div{
? ? ? ? ? ? width: 200px;
? ? ? ? ? ? height: 200px;
border-width:thick;}
?border-width: thick;粗的边框 系统会设置为5像素
border-width: medium;medium是中等的粗细 系统会默认设置为3像素
border-width: thin;thin是最细的 系统会默认设置为1像素
?border也是一个复合属性可以写成border:1px solid red;
border-top-width: 10px;设置上边框的粗细。同理设置下边框、左边框、右边框，可以将top改成bottom left right
border-width: 10px 20px; 设置边框 上下为10px 左右为20px
border-width: 10px 20px 50px;设置边框的粗细为 ?上边框10px 左右边框粗细为20px 下边框粗细为30px
border-width: 10px 30px 50px 70px;顺时针的顺序 设置边框的粗细 上边框为10px 右边框为30px 下边框为50px 左边框为70px
??设置边框的粗细 可以改变盒子的看上去的宽高
?border-style:none;边框没有任何样式 也就显示不了
border-style:hidden;隐藏边框的样式 也显示不了
border-style:dotted;边框的样式变成点状
?border-style:dashed;边框的样式变成虚线状
border-style:solid;边框的样式变成实线
border-style: double;边框变成两条实线
border-style: dotted dashed;两个值 表示上下是点状 左右是线状
border-style: dotted dashed double; 上边框为点状 左右为虚线 下边框是双实线
border-style: solid dotted dashed double; ?顺时针 按照上右下左的顺序 上边框是实线 右边框是点状 下边框是虚线 左边框是双实线
?border-top-style:dotted；单独设置上边框的样式为点状
?border-right-style: dashed;单独设置右边框的样式为虚线
border-bottom-style: double;单独设置下边框的样式为双实线
border-left-style:solid;单独设置左边框的样式为实线
?border-style必须加 因为 其他不加有默认值 而border-style没有颜色的默认是黑色 粗细的默认值是3px
*{margin:0;padding:0;}去除所有元素的内外边距
?margin:10px;margin只设置一个值 上右下左都会设置10px的外边距
margin:10px 50px;margin设置两个值 是上下外边距都是10px 左右外边距都是50px
?margin:10px 30px 20px;设置三个值表示 上边距是10px 左右是30px 下边距是20px
margin-top:20px;单独设置上边距
margin-right:20px;单独设置右边距
?margin-bottom: 20px;设置下边距
?margin-left:20px;单独设置左边距
EPLAN画黑盒子为什么是实线，不是虚线？
线型是可以设置的，右键黑盒，打开它的属性，选择格式，线型，就可以选择了。
设置盒子模型的右边框为2px、实线、红色
div+css中层的边框大小可以设置的，我们需要给这个div，width和height，然后在使用border来实现对边框的操作，boder:4px solid #f00;它的意思就是边框的宽度是4px，实线的，颜色是红色的，我们通过代码来理解下：
head
style
#div1{ //通过id实现
width:300px;
height:30px;
border:10px solid #f00;
marign:0 auto;
}
/head
body
div id='div1' class='div1'
p我的位置/p
/div
/body
/html
举报