文本样式
文本样式:
- color:设置文本颜色;
颜色属性一共有三种设置方法,如下:
<!--第一种直接用颜色-->
body {
color:red;
}
<!--第二种用十六进制-->
h1 {
color:#00ff00;
}
<!--第三种用rgb三原色-->
p.part1 {
color:rgb(0,0,255)
}
-
text-align:文本对齐;
文本对齐可设置为:居中(center)或对齐到左(left)或右(right),两端对齐。还有一种特殊的justify:每一行被张开为宽度相等,左、右外边距是对齐(如杂志和报纸)。 -
text-decoration文本修饰:overline上划线、line-through删除线、underline下划线;
注:可以控制超链接的下划线,设置为none。 -
text-transform控制文本字母:uppercase全大写、lowercase全小写、capitalize首字母大写;
-
text-indent首行缩进(px)
-
letter-spacing字符间距(px)
-
line-height行间距(px)
-
direction设置文本方向
默认,文本从左到右。设置为rtl,表示文字方向从右到左。 -
word-spacing字间距(px)
-
white-space设置元素中空白处处理
设置为nowrap,元素中禁用文字环绕。 -
vertical-align元素垂直对齐:text-top字符在图片上;text-bottom,默认,字符在图片下。
字体样式
字体样式:
-
font-family设置字体
-
font-size设置文字大小(可以用百分数、px、em)
-
font-style设置字体样式(normal正常、italic斜体、oblique斜体)
-
font-weight设置文字粗细(normal正常、lighter细、bold粗=900px)
-
font-variant以小型字体或者正常文字显示文本(norma正常、small-caps)
-
缩写:font: italic bold 12px Georgia,serif;
背景样式
背景样式:
-
background:简要属性,作用是将背景属性设置在一个声明中。
-
background-attachment:背景图像是否固定或者随着页面的其余部分滚动。
-
background-color:设置元素的背景颜色。
-
background-image:把图像设置为背景。
-
background-position :设置背景图像的起始位置。
-
background-repeat:设置背景图像是否及如何平铺。
使用代码:
body {
margin-left: 200px;
background-color: #5d9ab2;
/*用图片做背景*/
background-image: url('tree.png');
/*repeat-x只在水平上平铺,no-repeat不平铺,repeat-y只在垂直上平铺
平铺~重复叠加*/
background-repeat: no-repeat;
/*定位背景图片的位置*/
background-position: left top;
/*背景图片固定*/
background-attachment: fixed;
/*背景图片添加右边距,这样不会让图片和文本重叠影响文字观看效果*/
}
/*
上面可以缩写为:body { background:#ffffff url("img_tree.png") no-reprst right top; }
依次是:background-color背景颜色;background-image背景图片;background-repeat背景平铺;background-attachment背景图片固定或随其他页面的其余部分滚动;background-position背景图像的起始位置。*/