|
css文本样式
关键词:css文本样式,css文本属性
四、
| 序号 |
中文说明 |
标记语法 |
| 1 |
行 间 距 |
{line-height:数值|inherit|normal;} |
| 2 |
文本修饰 |
{text-decoration:inherit|none|underline|overline|line-through|blink} |
| 3 |
段首空格 |
{text-indent:数值|inherit} |
| 4 |
水平对齐 |
{text-align:left|right|center|justify} |
| 5 |
垂直对齐 |
{vertical-align:inherit|top|bottom|text-top|text-bottom|baseline|middle|sub|super}
|
| 6 |
书写方式 |
{writing-mode:lr-tb|tb-rl} |
语法:{line-height:数值|inherit|normal}
作用:行与行之间的距离
说明:行间距离取值
·不带单位的数字:以1为基数,相当于比例关系的100%
·带长度单位的数字:以具体的单位为准
·比例关系
注意:行距是指上下两行基准线之间的垂直距离。一般地说,英文五线格练习本,从上往下数的第三条横线就是计算机所认为的该行的基准线。如果文字字体很大,而行距相对较小的话,可能会发生上下两行文字互相重叠的现象。
语法:{text-decoration:inherit|none|underline|overline|line-through|blink}
作用:文本修饰,用于控制文本元素所用的效果,特别适用于引人注意的说明,警告等文本效果。
说明:
·inherit 继承
·none 无文本修饰,缺省设置
·underline 下划线
·overline 上划线
·line-through 删除线
·blink 闪烁
注意:同一语句中可以组合多个关键字。
例子:下划线 上划线 删除线 闪烁
使用下列语句可以使连接不再有下划线:A:link,A:visited,A:active { text-decoration: none }
语法:{text-indent:数值|inherit}
说明:取值范围
·带长度单位的数字
·比例关系
注意:文本缩进可以使文本在相对默认值较窄的区域里显示,主要用于中文板式的首行缩进,或是为大段的引用文本和备注做成缩进的格式。在使用比例关系的时候,有人会认为浏览器默认的比例是相对段落的宽度而言的,其实事实并非如此,整个浏览器的窗口才是浏览器所默认的参照物。另外,text-indent是块级属性,只能用于<p>、<blockquqte>、<ul>、<h1>~<h6>等标识符里。
语法:{text-align:left|right|center|justify}
作用:在元素框中水平对齐文本
说明:
·left 左对齐
·right 右对齐
·center 居中
·justify 两端对齐,均匀分布
注意:text-alight是块级属性,只能用于<p>、<blockquqte>、<ul>、<h1>~<h6>等标识符里。文本水平对齐可以控制文本的水平对齐,而且并不仅仅指文字内容,也包括设置图片、影像资料的对齐方式。
语法:{vertical-align:inherit|top|bottom|text-top|text-bottom|baseline|middle|sub|super}
说明:
·inherit 继承
·top 顶对齐
·bottom 底对齐
·text-top 相对文本顶对齐
·text-bottom 相对文本底对齐
·baseline 基准线对齐
·middle 中心对齐
·sub 以下标的形式显示
·super 以上标的形式显示
注意:文本的垂直对齐应当是相对于文本母体的位置而言的,不是指文本在网页里垂直对齐。比如说,表格的单元格里有一段文本,那么对这段文本设置垂直居中就是针对单元格来衡量的,也就是说,文本将在单元格的正中显示,而不是整个网页的正中。
例子:10<span style="vertical-align:sub">5</span> 105 10<span style="vertical-align:super">5</span> 105
语法:{writing-mode:lr-tb|tb-rl}
作用:文字的书写方式
说明:
·lr-tb 从左向左,从上往下
·tb-rl: 从上往下,从右向左
|