`

4、HTML语言剖析之排版标记

阅读更多
<!--注解--> ; <P> ; <BR> ; <HR> ; <CENTER> ; <PRE> ; <DIV> ; <NOBR> ; <WBR> ; 
■<!--注解-->: ▲Top

像很多电脑语言一样,HTML 文件亦提供注解功能。浏览器会忽略此标记中的文字(可以 是很多行)而不作显示,一般使用目的:
为文中不同部份加上说明,方便日后修改。
这对较复杂或非私人网页尤其重要,它不单是提醒自已,亦提醒你的同事这部分 做什么、那部分做什么。
例子:
<!--由这处开始是产品订购表格-->

用作版权声明。
假如你不希望别人使用或复制你的网页,可加上警告字眼。
例子:
<!--本文版权为 1998, Creation of Webpage 所拥有,未经许,请勿抄摘-->

■ <P> : ▲Top

<P>称为段落标记。作用:为字、画、表格等之间留一空白行。
本来<P>是一围堵标记,标于一段落的头尾,但从 HTML 2.0 开始己不需要</P>作结尾。

<P> 的常用参数: 如:<p align="center">

align="center"
可选值:right, left, center。
内定值: align="left"
例子: 原始码 Here is the text for my paragraph. It does't matter how long it is,
how many space are between the words or when I decide to hit the return key.
It will create a new paragraph only when I begin the tag with another one.
<P>Here's the next paragraph. 
显示结果 Here is the text for my paragraph. It does't matter how long it is, how many space are between the words or when I decide to hit the return key. It will create a new paragraph only when I begin the tag with another one.
Here's the next paragraph.



■ <BR> : ▲Top

<BR>称为换行标记。作用:令字、画、表格等显示于下一行。
由于浏览器会自动忽略原始码中空白和换行的部分,这令到<BR>成为最常用的标记之 一。因为无论你在原始码中编好了多漂亮的文章,若不适当地加上换行标记或段落标记, 浏览器只会将它显示成一大段。

错误示范:(邮局可不会接受一行过的地址) 原始码 566 E Boston Post RD
Mamaroneck NY 10543-9982
United States of America 
结果 566 E Boston Post RD Mamaroneck NY 10543-9982 United States of America 


正确例子: 原始码 566 E Boston Post RD
<BR>Mamaroneck NY 10543-9982
<BR>United States of America 
结果 566 E Boston Post RD
Mamaroneck NY 10543-9982
United States of America 


■ <HR> : ▲Top

<HR>称为水平线。作用:插入一条水平线。
<HR> 之参数修改:
以: <HR align="LEFT" size="2" width="70%" color="#0000FF" noshade> 为例。

align="LEFT"
设定线条置放位置,可选择:left;right;center 三种设定值。

size="2"
设定线条厚度,以像素作单位,内定为 2。

width="70%"
设定线条长度,可以是绝对值(以像素作单位)或相对值,内定为 100%。

color="#0000FF" 『只适用于IE』
设定线条颜色,内定为黑色。 #0000FF 代表蓝色,亦可以采用颜色的名称,即 text="blue" 。

noshade
设定线条为平面显示,若删去则具阴影或立体,这是内定值。
例子: 原始码 <HR>
<HR align="LEFT" size="4">
<HR align="LEFT" size="2" width="70%" color="#0000FF" noshade>
<HR align="LEFT" size="4" width="70" color="#008000"> 
显示结果
--------------------------------------------------------------------------------

--------------------------------------------------------------------------------

--------------------------------------------------------------------------------

--------------------------------------------------------------------------------



■ <CENTER> : ▲Top

<CENTER>称为居中标记。作用:令字、画、表格等显示于中间。
这标记原先是 Netscape 所定义,后来其它浏览器都支持它,但你会发现很多标记已有 align="CENTER" 的参数,<CENTER>似乎多馀了,事实上它还是常用的标记之一,其简单 易用,常用于文字上,对于己加有 align="CENTER" 参数的 <TABLE> 标记亦要不厌其烦 地加上居中标记,因有狻多浏览器不支持<TABLE> 标记中的 align="CENTER" 参数。

例子: 原始码 <CENTER>Chris's First Homepage</CENTER>
<CENTER>What's new</CENTER>
<CENTER>My profile</CENTER> 
结果 Chris's First Homepage
What's new
My profile 


■ <PRE> : ▲Top

<PRE>称为预设格式标记。作用:令文件按照原始码的排列方式显示。
这标记允许保留你于原始码中输入的空白及 Return。细看以下例子你便可体会到此标记的 威力。除了运用一大堆表格标记之外你只有采用这标记才能有此效果。

能以<PRE>标记产生对 效果,或产生多于一行的空白才算上乘!

例子: 原始码         <pre>        Creation of Webpage Log Analysis I

        Composer Learning  459 407 480 522 547 586 673
        HTML Advanced      200 268 296 358 385 453 506</pre>

显示结果                  Creation of Webpage Log Analysis I       

        Composer Learning  459 407 480 522 547 586 673
        HTML Advanced      200 268 296 358 385 453 506



■ <DIV> : ▲Top

<DIV>称为区隔标记。作用:设定字、画、表格等的摆放位置。
<DIV>应用于 Style Sheet(式样表)方面会更显威力,它最终目的是给设计者另一种组织 能力,有 Class ; Style ; title ; ID 等属性,将会于【Style Sheet】一节才作详述,这处只介绍 一个属性设定。
以 <DIV align="center"> 为例:


align="center"
可选值:center ; left ; right 。决定字、画、表格等居中、靠左或靠右。
<DIV align="center"> 的作用和居中标记 <CENTER>一样,前者是由 HTML3.0 开始 的标准,后者是通用己久的标示法。
例子: 原始码 <DIV align="center">Chris's First Homepage
<br>What's new
<br>My profile</DIV> 
结果 Chris's First Homepage
What's new
My profile


■ <NOBR> : ▲Top

<NOBR>称为不折行标记。作用:令某些文字不因太长而绕行,一 显示于同一行或下一 行。它对住址、数学算式、一行数字、程式码等尤为有用。
例子:(其中 Chris's Creation of Webpage 将不被分开而显示于同一行。) 码 If you want to know how to create you own homepage quickly, don't miss <NOBR>Chris's Creation of Webpage</NOBR> which will help you a lot. 
结果 If you want to know how to create you own homepage quickly, don't miss Chris's Creation of Webpage which will help you a lot. 


■ <WBR> : ▲Top

<WBR>称为建议折行标记。作用:预设折行部位。
它没有侵犯到 <BR> 的责任,只是作建议而已,若观者的系统解像度够高的话,那么它是 不会折行的。
例子:(若不加<WBR>标记,整个网址会显示于下一行。) 原始码 Please visit my other homepage which locate at http://www.geocities.com/SiliconValley/<WBR>Sector/8234/index.html There are many softwares for download. I think you will really love that place. 
结果 Please visit my other homepage which locate at http://www.geocities.com/SiliconValley/Sector/8234/index.html There are many softwares for download. I think you will really love that place.
分享到:
评论

相关推荐

    html标记语言详细解析与实例

    8. HTML 语言剖析之 HTML 标记一览:HTML 标记可以分为文件标记、排版标记、字体标记等,了解这些标记的用法是掌握 HTML 的关键。 9. HTML 语言剖析之文件标记:文件标记是 HTML 文件的开头部分,包括、、&lt;BODY&gt; 等...

    2022年HTML语言剖析(四)排版标记CSSHTML教程.docx

    在2022年的HTML语言剖析中,我们特别关注了排版标记,这些标记主要用于优化网页的布局和视觉呈现。以下是一些关于HTML排版标记的重要知识点,以及如何在实际应用中使用它们。 1. **注释标记**: HTML提供了`&lt;!-- ...

    HTML语言剖析之HTML标记一览

    2. **排版标记**: - `&lt;!--注解--&gt;`:HTML注释,用于添加不显示在页面上的说明。 - `&lt;P&gt;`:段落标记,用于组织文本内容,每个段落之间会自动添加空行。 - `&lt;BR&gt;`:换行标记,强制文本在下一行开始。 - `&lt;HR&gt;`:...

    HTML 语言剖析 教程

    6. 排版标记:`&lt;div&gt;`是布局容器,用于组合其他元素并进行样式控制。`&lt;span&gt;`用于在行内元素中插入小块内容。` `和`&lt;hr&gt;`分别表示换行和水平线,用于分隔内容。 7. 字体标记:`&lt;font&gt;`标签虽然在HTML5中已不推荐...

    html教程(最简单易学的html标记手册)

    HTML语言剖析 • 第一课 Html简介 • 第二课 HTML标记一览 • 第三棵 文件标记 • 第四课 排版标记 • 第五课 字体标记 • 第六课 清单标记 • 第七课 表格标记 • 第八课 表单标记 • 第九课 图形标记 •...

    html语言剖析

    HTML 是在 SGML 定义下的一个描述性语言,或可说 HTML 是 SGML 的一个应用程式,HTML 不是程式语言,如 C++ 和 Java 之类,它只是标示语言,基本上你只要明白了各种 标记的用法便算学懂了 HTML,HTML 的格式非常简单...

    HTML语言剖析.doc

    在"HTML语言剖析.doc"中,我们可以看到HTML语言的主要元素和它们的功能。 1. **文件标记**: - `&lt;html&gt;`:这是每个HTML文档的根元素,它包围整个文档,告诉浏览器这是一个HTML文件。 - `&lt;head&gt;`:这部分包含文档...

    HTML语言学习教程——HTML语言剖析[参照].pdf

    这个教程旨在为初学者提供全面的HTML语言剖析,帮助那些对HTML不熟悉的朋友掌握这一核心技术。 1. **HTML语言简介** HTML代表超文本标记语言,是一种用于组织网页结构和内容的标记语言。它通过使用一系列的标签...

    2022年HTML语言剖析(2)CSSHTML教程.docx

    在2022年的HTML语言剖析中,我们关注的焦点是与CSS(Cascading Style Sheets)和HTML排版相关的元素。这些元素对于创建有组织且视觉上吸引人的网页至关重要。 首先,让我们讨论HTML的注解功能。`&lt;!-- 注解 --&gt;`是...

    Html语言学习教程

    4. **排版标记**: - `&lt;!-- 注解 --&gt;`:用于添加注释,浏览器忽略这部分内容。 - `&lt;P&gt;`:定义段落,自动在前后添加空行。 - `&lt;BR&gt;`:强制换行。 - `&lt;HR&gt;`:插入水平线,分隔内容。 - `&lt;CENTER&gt;`:使内容居中...

    网页排版助手

    HTML(HyperText Markup Language)是网页的基础结构语言,包含了页面的布局、文本、图像等元素的标记。通过获取HTML代码,用户可以直接查看和分析网页的结构,这对于网页设计和SEO优化至关重要。 2. **CSS样式编辑...

    计算机【HTML语言】课件

    在HTML语言中,最基本的格式由若干个标签组成。每个HTML文档都始于`&lt;HTML&gt;`标签,它标志着整个文档的开始,并在`&lt;/HTML&gt;`标签处结束。文档内部又分为两大部分:`&lt;HEAD&gt;`和`&lt;BODY&gt;`。`&lt;HEAD&gt;`部分通常包含文档的元...

    html代码实例 - 网页版海报排版设计项目源代码

    HTML(HyperText Markup Language)是用于创建网页的标准标记语言,它是网页设计的基础,能够构建出结构化的页面内容。在这个“网页版海报排版设计项目源代码”中,我们可以深入理解HTML在网页版海报设计中的应用。 ...

    基于HTML语义分析的网页正文提取.pdf

    网页主要是由HTML(HyperText Markup Language)标记语言编写而成的,其结构决定了网页内容的布局和元素。HTML标签按照一定的语义规则,定义了文本、图片、链接等多种元素的布局与排版方式。因此,通过分析HTML标签...

    HTML文件到txt文件转换器.rar_ html文件转换成txt_HTML TXT_site:www.pudn.com_文件转

    HTML文件到txt文件转换器是一种工具,用于将HTML(超文本标记语言)格式的文档转换为纯文本(TXT)格式。HTML是网页设计的标准语言,它包含标记、样式和其他元素来构建网页布局和呈现内容。而TXT文件则是一种简单的...

    多张图片进行分页排版

    首先,我们需要了解HTML(超文本标记语言)的基础知识,它是网页内容的结构化表示语言。在本场景中,我们可以创建一个HTML页面,其中包含多个`&lt;img&gt;`标签来展示图片。每个`&lt;img&gt;`标签的`src`属性用于指向图片的URL,...

    制作一个简单HTML宠物猫网页(HTML+CSS)

    - **HTML(HyperText Markup Language)**: 是一种用于创建网页的标准标记语言。HTML文档是由一系列的元素组成,这些元素通过标签表示。 - **CSS(Cascading Style Sheets)**: 用于描述HTML或XML(包括各种XML语言...

    实训四-HTML基础知识之表格化网页.pdf

    HTML是网页的基本语言,包括HTML的基本结构、标记、属性和事件等。 九、 表格化网页的制作 表格化网页的制作需要使用HTML的表格标记,包括表格的基本结构、表格的边框、背景颜色和背景图片等。 十、 表格标记的...

Global site tag (gtag.js) - Google Analytics