网页设计文字与段落
3.1.6 注释标签
◆ 网页效果
3.2 HTML输出格式
3.2.1 文字格式化 3.2.2 计算机输出格式 3.2.3 引文和定义
3.2.1 文字格式化
HTML中提供了很多元素用来对HTML输 出方式进行修饰,如加粗、斜体等。
标签 <b> <i> <big> <small> <sup> <sub> <u>
3.1.2 定义段落
◆ 语法说明
在HTML文件中,<p>标记是一个段落标记符号, 利用<p>标记可以对网页中的文字信息进行段落的定 义,但不能进行段落格式的定义。
段落标记<p>的属性align用来设置段落的对齐方式, 其取值可以为left、center、right或justify,分别表示 居左、居中、居右、两端对齐。缺省时默认为left。
3.1.4 水平分割线
◆ 网页效果
3.1.5 部分标签
部分标签<div>可以将文档分割成独立的、不同的 部分。在<div>标签中定义的文本内容,实际上与没有 在<div>标签中定义的文本内容没有什么区别,但可对 <div>标签进行样式的定义,如引入align属性或使用 CSS。
◆ 基本语法
<div>内容</div>
HTML 4.01与XHTML标准中提供了6个级别的标题, 标题标签被定义在<h1>到<h6>范围内,其中<h1>为最 大标题, <h6>为最小标题。
基本语法:
<h1>内容</h1> <h2>内容</h2> <h3>内容</h3> <h4>内容</h4> <h5>内容</h5> <h6>内容</h6>
<html> <head> <title>回车</title> </head> <body>
刚刚过去的2006年对博文视点的发展来说是意 义非凡的一年,<br>在市场不断变化,道路并不 平坦的一年中,博文视点能够稳住军心,坚持自 己的出版方向,逐渐成为IT出版界的旗舰级机构。 </body> </html>
第3章 文字与段落
3.1 HTML基本标签 3.2 HTML输出格式 3.3 HTML字体设置
3.1 HTML基本标签
3.1.1 设置标题 3.1.2 定义段落 3.1.3 换行标签 3.1.4 水平分割线 3.1.5 部分标签 3.1.6 注释标签
3.1 HTML基本标签
在HTML网页中添加文字
3.1.6 注释标签◆ 基 Nhomakorabea语法<html> <head> <!--请在此添加注释语句!--> <title>添加注释<title> </head> <body> <!--请在此添加注释语句!--> <comment>此处也可以添加注释语句</comment> </body> </html>
3.1.6 注释标签
一个强制换段标记<p>可以看作是两个强制换行标 记<br>。
3.1.2 定义段落
◆ 实例代码
<html> <head> <title>段落</title> </head> <body> 《登金陵凤凰台》<br> 李白<br> <hr> <p> 凤凰台上凤凰游,凤去台空江自流。 吴宫花草埋幽径,晋代衣冠成古丘。 三山半落青天外,二水中分白鹭洲。 总为浮云能蔽日,长安不见使人愁。 </p> </body> </html>
《登金陵凤凰台》<br> 李白<br>
<hr> 凤凰台上凤凰游,凤去台空江自流。<br> 吴宫花草埋幽径,晋代衣冠成古丘。<br> 三山半落青天外,二水中分白鹭洲。<br> 总为浮云能蔽日,长安不见使人愁。<br> </body> </html>
3.1 HTML基本标签
◆ 网页效果
3.1.1 设置标题
◆ 基本语法
<body> 请在此处添加文字! </body>
3.1 HTML基本标签
◆ 语法说明
在网页中添加文字,只要在 <body></body>之间,需要插入文字 的地方输入文字就可以实现。
3.1 HTML基本标签
◆ 实例代码
<html> <head> <title>添加文字</title> </head> <body >
3.1.2 定义段落
◆ 网页效果
3.1.3 换行标签
在HTML文档中,无法用多个回车、空格、 〈Tab〉键来调整文档段落的格式。要用HTML的 标记来强制换行、分段。
强制换行标记<br>放在一行的末尾,可以使后 面的文字、图片、表格等显示于下一行,而又不会 在行与行之间留下空行,即强制文本换行。由于浏 览器会自动忽略原始码中空白和换行的部分,这使 <br>成为最常用的标记之一。
3.1.3 换行标签
◆ 网页效果
3.1.4 水平分割线
水平分割线是HTML中的基础标签,通常用 来将网页中相同的部分分割成一组,使网页层 次更加清晰。 ◆ 基本语法:
<body>
<hr>
</body>
3.1.4 水平分割线
水平分割线的属性
3.1.4 水平分割线
◆ 实例代码
<html> <head>
</body> </html>
课前复习
2 设置基底网址<base>
课前复习
3 主体内容<body>
主体内容<body>的属性有:设置页面背景bgcolor、 设置页面边距topmargin、leftmargin、rightmargin、 bottommargin和设计正文颜色text。
<body>作为HTML文件主体的标签,有且只有一个, 当需要设置多个<body>的属性时,参照2.2.2,标记属性的 语法: <标记名字 属性1 属性2 属性3 … >
href用于设置网页文件链接的地址
target用于设置页面显示的目标窗口。
target属性值及描述:
属性值 _blank _self _parent _top
描述 在新窗口中打开被链接文档。 在被点击时的同一框架中打开被链接文档(默认)。 在父框架中打开被链接文档。 在窗口主体中打开被链接文档。
课前复习
◆ 语法说明
给代码添加注释语句时,<!-->或 <comment>可以放在HTML文件的任何地方, 都不会在网页中被显示出来。
3.1.6 注释标签
◆ 实例代码
<html> <head> <!--请在此添加注释语句!--> <title>添加注释</title> </head> <body> <!--下面是李白的诗!--> 《登金陵凤凰台》<br>李白<br> <hr> 凤凰台上凤凰游,凤去台空江自流。<br> 吴宫花草埋幽径,晋代衣冠成古丘。<br> 三山半落青天外,二水中分白鹭洲。<br> 总为浮云能蔽日,长安不见使人愁。<br> <comment>李白的诗结束</comment> </body> </html>
2 设置基底网址<base>
<html> <head> <base href=“http://www. Broadview. ”
target=“_self”> </head> <body>
2007年1月16日,电子工业出版社<A href="index">博文视点 </A>公司召开了“博文视点三周年庆典暨颁奖晚会”。 刚刚过去的2006年对博文视点的发展来说是意义非凡的一年, 在市场不断变化,道路并不平坦的一年中,博文视点能够稳住 军心,坚持自己的出版方向,逐渐成为IT出版界的旗舰级机构。
课前复习
3 主体内容<body>
<html> <head> <title>第一个网页</title> <meta name=keyword content=“实验、考察”> </head> <body text="white" bgcolor=“blue“ topmargin=20
leftmargin=20 rightmargin=20 bottommargin=20 > 课堂练习 </body> </html>
<html> <head> <title>设置标题</title> </head> <body >