网页文本内容设计

最新推荐文章于 2024-11-06 11:45:04 发布

「已注销」

最新推荐文章于 2024-11-06 11:45:04 发布

阅读量1k

点赞数

文章标签： firefox behavior opera 浏览器 html 文档

本文链接：https://blog.csdn.net/xin_l_o/article/details/6500887

版权

/> href="file:///C:/Documents and Settings/Administrator/Application Data/EIOffice/eiohtml/clip_editdata.mso" rel="Edit-Time-Data" /> href="file:///C:/Documents and Settings/Administrator/Application Data/EIOffice/eiohtml/clip_oledata.mso" rel="OLE-Object-Data" />

１.设置文字格式

１）设置文字大小：使用<font>标记中的size属性可以设置文字大小

语法：<font size=”文字大小”>……</font>

size标记的属性

属性值	说明
绝对整数	从1到7的整数，代表字体大小的绝对字号
相对整数	从-4到+4的整数(不包含0)，字体相对于3号的放大和缩小字号(+不能省略)

例如：

２）设置标题：html文档中包含有各种级别的标题，各种级别的标题由<h1>到<h6>标记来定义，其中<h1>代表最高级别的标题，依次递减，<h6>级别最低。（不同浏览器，标题确切的尺寸大小不相同的，但<h1>标题大约是标准文字高度的2到3倍，<h6>标题则比标准字体略小）

例如：<h1>h1</h1><h2>h2</h2><h3>h3</h3><h4>h4</h4><h5>h5</h5><h6>h6</h6>

注：有自动换行的功能，毕竟是标题么。

３）设置字体：face标记用于设置文本所采用的字体名称，使用者的浏览器中只有安装了设置的字体后，才可以正确显示，否则这些特殊字体会被水产品中的普通字体所代替。

语法：<font face=”字体的名称”>……</font>

说明：face属性的值可以是１个或多个，默认情况下，使用第1种字体显示，如果第1种字体不存在，则使用第2种字体代替，依此类推，如果都不存在，则以默认字体显示。

例如：<font size="7" face="华文新魏">华文新魏</font>

４）设置文字的颜色　语法：<font color=”字体的颜色”>……</font>

例如：<font size="7" face="华文新魏" color="green">华文新魏</font>

５）加大与缩小（行内元素）：big(small)标记所包含的文字在浏览器中显示会比普通文字大(小)一级，如果多个big(small)标记作用于同一文本，则字号会逐级增大(缩小)。

例如：<big><big><big><big>3</big></big></big></big>

注：最多能增大到7级，小的话大概是1级吧（最小的几级也没什么区别的了）

６）粗体与斜体（行内元素）：<b>和<strong>是html中格式化粗体文本的最基本元素。<i>、<em>和<cite>是html中格式化斜体文本的最基本元素。

例如：正常

　　<b>斜体b</b><strong>斜体strong</strong>

７）上标与下标：使用上标与下标可以将一段文字以小字体方式显示在另一段文字的右上角或右下角，在各种数学公式、日常计算、书籍文章注解，甚至某些外语脚本中都有广泛的运用。（上标与下标可以一起使用）

例如：正常内容<sup>上标内容</sup><sub>下标内容</sub>正常内容<sub>1<sup>1</sup></sub>

８）删除线与下划线：strike和s都可以用于为文字添加删除线效果，u和ins可以为文字添加下划线效果。（删除线与下划线可以一起使用）

９）设置等宽字体：code和samp标记用于设置网页中字体的等宽效果，常用于英文的设置。（等宽字的字体好像不受face设置的限制，好像有默认的规定的字体，如例子所示）

例如：<font face="微软雅黑">PMroportional<br/>pm<code>Monospaced</code>

２.设置段落格式

１）简单换行：在不另起一段的情况下将当前文本强制换行。<br/>

２）开始一个新段落：使用<p>标记来实现。

３）文字居左、居中与居右：align标记能够设置元素的左对齐、居中、右对齐和两端对齐方式。语法：<p align=”对齐方式”></p>

align的取值

属性值	说明
left	左对齐
center	居中对齐
right	右对齐
justify	两端对齐

justify有点问题

４）设置段落的文字方向：bdo标记是一种文字方向的双向算法，用来指定特殊的文字书写方向。语法：<bdo dir=文本方向>显示的内容</bdo>

说明：dir用来指定从左到右或从右到左的文字方向，它的属性有ltr(left to right)和rtl(right to left)两种。

例如：<bdo dir=rtl>双向算法</bdo>

５）水平线：可以分隔文档的内容，使文档结构清晰、层次分明、便于浏览。水平线自身具有很多属性，如宽度、高度、颜色和排列对齐等。

语法：<hr width=”宽度” size=”高度” color=”颜色” align=”对齐方式” noshade>

说明：width可以是以绝对的像素为单位，也可是以相对的百分比为单位。size只能使用绝对的像素来定义，color用来设置颜色，align用来设置水平线的对齐方式，noshade可以去掉水平线的阴影且设置为实心（默认的水平线是空心立体的效果）。

注：

情况	结果
没有设置color和noshade	ie,firefox：灰白; opera:同body文本颜色设置
没有color，有noshade	ie,firefox,opera：都是灰色，实心
color=””，没noshade	ie,firefox：灰白，opera：实心，黑色
color=””，有noshade	ie,firefox：灰色实心，opera：黑色实心
有color，没noshade	ie,firefox,opera：color颜色且实心
有color，有noshade	ie,firefox,oepra：color颜色且实心
注：firefox实心时，线条的角是圆角，其他是方角。空心时都方角。