菜鸡教学~3

##今天我们来讲一讲边框字体和文本、边框

##文本样式有哪些
字体
1.字体的颜色：color
2.字体的大小：font-size px为单位
3.字体格式：font-family
4.字体的行行高：line-height 是以宽高多少设置
5.字体的粗细：font-weight（取值有100-900从小到大）bold=900
6.字体倾斜：font-style：italic
div{
width: 100px;
height: 100px;
color: red;
font-size: 100px;
font-family: 楷体;
line-height: 100px;
font-weight: bold;
font-style: italic;
}

文本
1.文本的水平位置:text-align 分别是（left 左）、（中center）、（右ringht）
2.垂直位置line-height刚刚上面讲到了也就是行高
3.首行缩进text-indent 单位是em
4.划线text-decoration 分别的是下划线underline、上划线overline、中划线linethrough
div{
width: 100px;
height: 100px;
border: 1px solid red;
/* text-align: center; */
line-height: 100px;
text-indent: 1em;
text-decoration: underline;
}

##边框,上面也用到了边框
##border
1.border-width 边框的粗细 单位px
2.border-style 实线solid
3.border-color 边框的颜色
上面的组合写法：border: 1px solid red;
div{
width: 300px;
height: 300px;
border: 3px solid red;
}

##还可以单独设置一个边框
1.border-top 上边框
2.border-bottom 下边框
3.border-left 左边框
4.border-right 右边框
div{
width: 300px;
height: 300px;
border-right: 3px solid red;
}