文本输入及HTML属性

2.2.1　文本输入及HTML属性

网页内容的编辑，一般在“设计”视图下进行，必要的时候转换到“代码”视图修改代码。当处于“设计”视图时，可直接在文档窗口中输入文本，但在网页中输入空格字符是有讲究的，直接使用空格键只能插入一个空格字符，要连续插入多个空格，可以选用下列方法之一：

(1)选择菜单“插入”−>“HTML”−>“特殊字符”−>“不换行空格”命令；

(2)在“代码”视图中，加入“ ”占位符；

(3)按Ctrl+Shift+空格快捷键插入空格(推荐使用此方法)。

在“设计”视图中，每按一次回车键，系统默认为一个段落，转换到“代码”视图，可以看到在一段文本的前后加上了一对<p>……</p>标签。

例如，选择“设计”视图时，在文档窗口输入：

锄禾

锄禾日当午，

汗滴禾下土。

谁知盘中餐，

粒粒皆辛苦。

我们来设置其HTML属性，从图2-5所示的文本属性面板可以看出，文本的HTML属性主要有格式、类、加粗倾斜、列表、ID、链接等项目。

下面对这首诗应用格式与列表来编排一下。选择“锄禾”，在HTML属性的“格式”下拉列表选项中，选择“标题2”，加粗；再选择其余四句，单击“项目列表”或“编号列表”按钮，转到“代码”视图，可看到body标签内有如下代码：

<h2><strong>锄禾</strong></h2>

<ul>

<li>锄禾日当午，</li>

<li>汗滴禾下土。</li>

<li>谁知盘中餐，</li>

<li>粒粒皆辛苦。</li>

</ul>

<h2><strong>锄禾</strong></h2>

<ol>

<li>锄禾日当午，</li>

<li>汗滴禾下土。</li>

<li>谁知盘中餐，</li>

<li>粒粒皆辛苦。</li>

</ol>

切换到“实时”视图，可看到如图2-8所示的效果：

图2-8　文本标题、加粗与列表

如果要给文本选择某一种汉字字体、字颜色、字大小等属性，就要为文本设置CSS属性才行。其中的“类”是指通用的样式类，“ID”就是指ID类，要应用这些类，就必须要先定义才行。

在图2-5所示的文本CSS属性栏里，有“目标规则”、“编辑规则”、“CSS面板”、字体、大小、颜色、加粗倾斜、水平对齐方式(左对齐|右对齐|居中|两端对齐)等选项。通过这个面板可以为文本创建和指定CSS样式。

关于空格的插入，直接按空格键只能插入一个空格，要连续插入多个空格，可以使用下列方法之一：

(1)在“代码”视图中，加入“&nbsp;”占位符；

(2)选择菜单“插入”−>“HTML”−>“特殊字符”−>“不换行空格”命令；

(3)按Ctrl+Shift+空格快捷键插入空格(推荐使用此方法)。