欢迎光临散文网 会员登陆 & 注册

html文字和段落的属性

2023-03-23 21:49 作者:oppo绿  | 我要投稿

(1) 字体 Font-family 属性
可给字体 Font-family 属性设置一种或多种字体,这样使得客户端浏览网页时如果没有第一种字体,则顺延下一种字体显示。如果 Font-family属性中指定的字体在客户端都没有,则以系统默认字体显示。
可设置字体样式代码如下:
.style1{
font-family: "方正兰亭超细黑简体","微软雅黑","黑体";}

当文字引用 style1 类样式时,如果没有“方正兰亭超细黑简体”字体,则用“微软雅黑”字体显示;如果也没有“微软雅黑”字体,则用“黑体”字体显示文字;如果客户端也没有“黑体”字体,则用浏览器默认的字体显示文字。

(2)字号Font-size 属性
衡量字体大小的单位如下。
1)px(像素):根据显示器的分辨率来确定长度。
2)pt(字号):根据 Windows 系统定义的字号大小来确定长度。
3)in、cm、mm(英寸、厘米、毫米):根据显示的实际尺寸来确定长度。此类单位不随显示器的分辨率改变而改变。
4)ex:当前字母“x”的高度,一般为字体尺寸的一半。
5)%:以当前文本的百分比定义尺寸,例如,{font-size:200%}是指文字大小为原来的2倍。
6)em:相对长度单位,单位 em 是一种相对的字体高度,如设置 body 字体大小为 lem,即相当于是 lem=16px,在其他样式中设置字体大小为 0.8em,那么换算为像素单位是 1x0.8x16px=12.8px。通过修改 body 标签中字号的大小,就能按比例修改所有字体大小。

(3)字体 color 属性
字体的颜色属性 color 的值以#号开头,可用3位十六进制数表示,其中第1 位表示红色,第2位表示绿色,第3位表示蓝色,如#00f表示蓝色:也可用6位十六进制数表示,其中第 1、2 位表示红色,第 3、4 位表示绿色,第5、6位表示蓝色,如#00ff00 表示绿色,如设置字体蓝色的样式代码如下:
color:#00f;

(4) 字体的其他属性
设置粗体、斜体、划线、缩进、字符转换与间隔等。这里所说的文本样式主要是指粗体、斜体、下划线等样式:

Font-weight:可设置字体加粗、减细或其他数值。Font-style:设置字体为斜体,有两个值可选:italic和oblique,倾斜角度不同。
Text-decoration:主要可对字体设置下划线、上划线、删除线和无任何线形式,如文字链接,要去掉默认的下划线时则可通过设置这个属性值为none。另外可设置下划线的线型、颜色等。
Font-variant:设置英文字符为小型大写字母。
Text-transform:将英文字符设置为大写、小写或首字母大写方式。 Letter-spacing:对中英文字符间的间距和英文单词间距均产生影响。 Word-spacing:对英文字符间距产生影响。 Text-indent:设置文本块的缩进程度。
Display:指定是否显示以及如何显示元素,常用属性值有inline、block、 inline-block 等。

(5)段落及行距设置
设置段落分段及行距。调节网页中文本的分段及设置行距的方法如下:
<p>分段行距
一般在文档编辑器中使用回车键进行分段换行,在代码视图标记符号为
<p>文本内容……</p >
用这种方式产生的分段,段与段之间的间隔比普通行距要大一些。段落的行距如果没进行样式设置则为默认行距,默认行距的大小也与设置的字体字号相关。

<br/>分段行距
如果设置段落间的间隔与默认方式行距一样,则可以按 Shift+Enter 组合键来完成,在代码视图标记符号为<br/>。
Line-height 行距设定
段落中每行文字的间隔可以通过样式代码来设定行距。通过样式规则定义对话框中选择“类型”标签,设置合适的Line-height属性值设置段落行距,行距的表达方式可以是倍数、百分比,也可以是 px、pt、em、cm 等,主要有如下几种。

Line-height 设置为 2:不带单位表示设置为2倍行距。
Line-height 设置为 25px:带单位的,表示实际单位值,25px表示设置行距为 25 像素高。
Line-height 设置为 150%:表示150%的行距。

(6)文本对齐方式设置
文本的水平对齐
文本的水平对齐方式通常有4种:左对齐、居中对齐、右对齐和两端对齐,默认为左对齐方式。通过设置 CSS 样式的 text-aligh 属性实现,设置文本居中对齐样式代码如下:
text-align:center;
文本的垂直对齐
文本垂直对齐适用于内联元素(如td、a和img等元素),有三种对齐方式。
top 对齐指与行内最高元素的 top 对齐。
middle是指元素的路线与基线对齐。
bottom 是指行的 bottom 对齐,要注意的是 bottom 不等于 baseline,它类似于英语作业本格子线,字母a下部分对应的是baseline,而字母g下部分不是baseline。

html文字和段落的属性的评论 (共 条)

分享到微博请遵守国家法律