文本属性
'''
font-size: 10px; 字体大小
text-align: center; 横向排列
line-height: 200px; 文本行高 通俗的讲,文字高度加上文字上下的空白区域的高度 50%:基于字体大小的百分比
vertical-align:-4px 设置元素内容的垂直对齐方式 ,只对行内元素有效,对块级元素无效
text-indent: 150px; 首行缩进
letter-spacing: 10px; 字符间距
word-spacing: 20px; 单词间距
text-transform: capitalize; 单词首字母大写
'''
边框属性
'''
border-style: solid; 边框样式(solid为实线dashed为虚线)
border-color: chartreuse; 边框颜色
border- 20px; 边框粗细
border-radius: 20px; 设置为圆角的边框
简写:border: 20px rebeccapurple solid;
'''
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="keywords" content="css文本属性与边框属性">
<meta name="description" content="study">
<meta http-equiv="Refresh" content="1800;https://www.baidu.com">
<meta http-equiv="x-ua-compatible" content="IE=EmulateIE7">
<title>标题</title>
<link rel="stylesheet" href="day109.css">
<link rel="icon" href="https://www.baidu.com/favicon.ico">
<!--<script src="js.js"></script>-->
</head>
<body>
<div class="div1">笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞
笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞笨鸟先飞
笨鸟先飞笨鸟先飞
</div>
<div class="div2">
hello world hello world hello world hello world hello world hello world hello world hello world hello world
hello world hello world hello world hello world hello world hello world
</div>
<div class="div3"></div>
</body>
</html>
.div1,.div2{
height: 100px;
/*标签高度100px*/
background-color: antiquewhite;
/*标签背景颜色*/
text-align: center;
/*文本横向排列*/
/*line-height: 100px;*/
/*文本行高*/
text-indent: 50px;
/*首行缩进*/
letter-spacing: 10px;
/*字符间距*/
word-spacing: 10px;
/*单词间距*/
text-transform: capitalize;
/*首字母变大写*/
}
.div3{
width: 300px;
height: 300px;
border: 5px dashed green;
/*简写*/
/*border- 5px;*/
/*上下左右边框粗细*/
/*border-style: dashed;*/
/*上下左右边框样式,dashed为虚线,solid为实线*/
/*border-color: green;*/
/*上下左右边框颜色*/
border-left-color: #d900ff;
/*左边框*/
border-right-color: lightpink;
/*右边框*/
border-top-color: red;
/*上边框*/
border-bottom-color: yellow;
/*下边框*/
}