1.字属性
1)设置文字大小：
font-size
2)设置文字颜色：
color
3)设置字体名：
font-family
4)设置字体粗细：
font-weight (取值：100-900)
5)设置倾斜：
font-style(italic文字倾斜)
6)内容对齐方式：
text-align:(center,left,right)
7)设置行高：
line-height:(文字一行的高度，文字只要一行，设置高和标签的高度相同，可以让文字居中)
8）简写：
font:字号 行高 字体；
9）文字修饰：
text-decoration:(none:去掉文字修饰，under-line:添加下划线，line-through：添加删除线，over-line：添加上划线)
10）首行缩进：
text-indent:4em(单位：em,空格的意思)
11)字间距:
letter-spacing:1px
2.列表属性
1)设置符号样式：
list-style-type:(disc(实心圆)circle(空心圆)square(实心方块)none(去掉列表符号))
2)设置图片的符号：
list-style-image:(url(路径))
3）设置符合的位置：
list-style-position:(inside--在li标签的里面outside--在li标签的外面)
3.背景
1)背景图：background-image:url(路径)
如果背景图大于盒子大小，背景图能显示多少就显示多少
如果背景图小于盒子大小，背景图就会平铺(重复显示)
2）是否平铺
background-repeat:(不平铺：no-repeat):
3)背景图固定(不常用)
background-attachment:(固定：local 滚动：scroll)
4)设置背景图位置
background-position:(x：left/center/right/数值 y:top/center/bottom/数值)
x，y的顺序可以改变
5)简写：background:url(路径) no-repeat(是否平铺) x y(图片位置)
background:url(路径) no-repeat(是否平铺) x y(图片位置) 背景颜色
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style type="text/css">
p{
/*文字大小*/
font-size: 20px;
/*文字颜色*/
color: red;
/*设置字体名*/
font-family: "微软雅黑";
/*设置字体粗细*/
font-weight: 400;
/*设置倾斜*/
font-style: initial;
/*内容对齐方式*/
text-align:left;
/*首行缩进*/
text-indent: 2em;
/*字间距*/
letter-spacing: 0px;
}
/*============列表===============*/
ul{
}
li{
/*list-style-type: square;*/
list-style-image: url(img/icon.ico);
background-color: red;
float: left;
list-style-position: inside;
}
#d1{
height: 300px;
background-image: url(img/logo.png);
/*background-repeat: no-repeat;
background-position:center top;
background-attachment: local;
background-color: red;*/
background: url(img/logo.png) no-repeat center white;
}
</style>
</head>
<body>
<div id="d1">
<!--<img src="img/logo.png" style="width: 100%;height: 300px;"/>-->
</div>
<ul>
<li>abc</li>
<li>123</li>
<li>hello</li>
<li>yes</li>
</ul>
<div id="">
<p>
的健身房搜集第三季度孤苦伶仃健康的将管理卡视角国际大酒按揭房老师就给来说简单
空格键了圣诞节噶监督管理局点击点击罚款店高科技的数量快捷方式离开
</p>
</div>
</body>
</html>
网友评论