一、 文字属性
-
color字体颜色
color属性:用于定义文字的颜色。 -
font-size字号
font-size属性:设置文字的大小。 属性值只要求数字加单位,可以是百分比,其他不需要掌握。常用的网页文字大小有12px(正文)、14px(标题) -
font-family字体: “黑体”“宋体”“微软雅黑” 首先执行第一个字体
font-family属性:设置字体,如宋体、黑体、隶书等。字体的表示方式只要求掌握字体名称,其他不要求掌握。 -
font-weight字体加粗 normal普通字体100-500
bold 设置粗体
normal将粗体改为正常字体 -
font-style字体倾斜(倾斜方式: i em address font-style )
italic倾斜
normal普通字体
二、 段落属性 -
文字修饰(text-decoration):p默认情况下是text-decoration:none;
underline下划线
overline 上划线
line-through删除线
none 无修饰 -
水平对齐方式(text-align) 默认 left
text-align属性:设置文本的水平对齐方式。属性值可以设置为left、center、right等,即如何为文本设置左对齐、居中对齐和右对齐。 -
文本缩进(text-indent) 假如设置一个比较大的负数,可以做出文字消失效果
text-indent属性:设置文本块中首行的缩进,属性值可设置为数值加单位或者用em设置缩进几个字,百分比和负值不要求掌握。
如:p{text-indent:24px} 或 p{text-indent:2em;} -
文本行高 (line-height) 如果line-height 和 height的值一样,则可以做出文字垂直居中效果
line-height属性:设置行间距,即行高。属性值可设置为数值加单位,百分比和负值,负值不要求掌握。
代码:
p.show{
letter-spacing: 29px;/字母之间的间距/
word-spacing: 3px;–空格的宽度
border: 1px solid red; --边框
line-height: 150px; --行高
text-align: center;/对齐方式/
text-indent: 10px;/首行缩进/
text-transform: capitalize;/首字母/
text-shadow: 10px -10px 5px cornflowerblue;/文本阴影/
text-decoration: underline; --下划线}
-
边框属性【块级标签】
#yy{
border-style: dashed;/*边框虚线 实心 solid */
border-width: 2px;
border-color: blue;
height: 100px;
width: 100px;
border-top-style: solid;/*顶部边框样式
}
div.love{/圆角边框/
border: 1px solid red;
height: 100px;
width: 100px;
border-radius: 50px;/边框圆角半径 50 就是园了/
box-shadow: 10px 10px 2px red;/盒子的阴影/ box-shadow: 0px 0px 10px #000000;/黑色无偏移量/
}
hello,my name is yolanda
四、 列表案例符号的样式 list-style
list-style-type 定义列表前面的项目符号
Disc(实心圆)、circle(空心圆)、 square(方块)、 none(不使用任何标号)。
list-style-image 定义列表项标志的图像【设置了图片上面的不好用了最好上个属性设置成none】
语法格式如下:list-style-image:none|url(url)
list-style-position 列表位置
语法格式如下:list-style-position:outside(默认)|inside()在列表li的里面还是外面
去掉列表案例符号的代码是: ul{list-style:none;}
- 列表
- 列表2
- 列表3