文本格式化
Posted 野得像风
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了文本格式化相关的知识,希望对你有一定的参考价值。
文本格式化
1、控制字体
1、指定字体
font-family:"microsoft yahei",arial,"宋体";
2、字体大小
font-size: px , pt 作为单位 30pt 16pt
常用字体大小:12px - 14px
3、字体加粗
相当于 <b></b>
font-weight : normal / bold ;
建议:通过 该属性取代 b 标签
4、字体样式
斜体
font-style:normal / italic;
相当于<i></i>
5、小型大写字母
font-variant : normal / small-caps;
6、字体属性 font
将所有的属性设置在一个声明当中
font:font-style font-varaint font-weight font-size font-family;
eg:font:italic small-caps bold 12px "microsoft yahei",arial;
常用写法:
font :font-size font-family;
font:bold 12px "microsoft yahei";
其他写法:
font : font-size/line-height font-family;
font:12px/24px "microsoft yahei";
line-height : 行高
2、文本属性
1、颜色
color : 颜色值 ;
rgba(255,0,0,0.5);
2、文本排列
text-align:left/right/center; 元素中的内容水平对齐方式,大部分主流浏览器,只对行内元素起作用,对块不起作用
vertical-align:top / bottom / middle / baseline; 文本内容垂直对齐方式
baseline : 基线对齐
3、文字修饰(线条)
text-decoration:none / underline
none : 去除文本上的线条
underline : 下划线
overline : 上划线
linethrough : 删除线 <s></s>
4、行高
每行文本所占据的高度。如果行高的值高于文本的高度,那么这段文本会在行高范围内垂直居中显示。
使用方式:
1、将行高与容器高度设置为一致,从而使容器内的文本垂直居中显示。(只针对一行数据)
2、如果想给文本增加上下的边距,也可以使用line-height
5、首行文本缩进
让元素内的首行文本,空出指定的像素值
text-indent:value;
6、文本阴影
text-shadow:h-shadow v-shadow blur color;
常用例子:text-shadow: 5px 5px 5px #FF0000;
以上是关于文本格式化的主要内容,如果未能解决你的问题,请参考以下文章