宽容他人,放过自己。

CSS Fonts(字体)部分

Posted on By anchoriteFili

text有关的所用元素

/*
所有css文本属性
color : 设置文本颜色
direction : 设置文本方向
letter-spacing : 设置字符间距
line-height : 设置行高
text-align : 对齐元素中的文本
text-decoration : 向文本添加修饰 上中下添加一条线
text-indent : 缩进元素中文本的首行
text-shadow : 设置文本阴影
text-transform : 控制元素中的字母 大小写控制
vertical-align : 设置元素的垂直对齐
white-space : 设置元素中空白的处理方式
word-spacing : 设置字间距
*/

相关代码

h1 {
    color:#666; /*字体颜色*/
    text-align:center; /*对齐方式*/
    text-decoration:overline; /*字上面加线*/
}

h2 {
    text-decoration:line-through; /*字中间加线*/
}

h3 {
    text-decoration:underline; /*字最下部加线*/
}

p.date {
    text-align:right; /*右对齐*/
}

p.mian {
    text-align:justify; /*两边对齐*/
    text-indent:50px; /*文本的第一行的缩进*/
    letter-spacing:2px; /*字符与字符之间的距离*/
    line-height:70%; /*行与行之间的空间*/
    direction:rtl; /*文本方向,从右到左的文本方向*/
    word-spacing:30px; /*单词与单词之间的的空白空间*/
    white-space:nowrap; /*在元素内禁用文字环绕*/
}

/*文本转换*/
p.uppercase {
    text-transform:uppercase; /*全大写*/
}

p.lowercase {
    text-transform:lowercase; /*全小写*/
}

p.capitalize {
    text-transform:capitalize; /*单词首字母大写*/
}

/*去掉连接下的下划线*/
a {
    text-decoration:none; 
}

/*垂直对齐图像:文字相对于图片的对齐方式*/
img.top {
    vertical-align:text-top; /*与图片平行的文字在图片的上头*/
}

img.bottom {
    vertical-align:text-bottom; /*与图片平行的文字在图片的下部*/
}

/*添加文本阴影*/
p.shadow {
    text-shadow:2px 2px #993300;
}