HTML基础理解.docx
- 文档编号：12278782
- 上传时间：2023-04-17
- 格式：DOCX
- 页数：18
- 大小：21.11KB
HTML基础理解.docx
《HTML基础理解.docx》由会员分享，可在线阅读，更多相关《HTML基础理解.docx（18页珍藏版）》请在冰豆网上搜索。
HTML基础理解
HTML标签
HTML标记标签通常被称为HTML标签（HTMLtag）。
∙HTML标签是由尖括号包围的关键词，比如
∙HTML标签通常是成对出现的，比如和
∙标签对中的第一个标签是开始标签，第二个标签是结束标签
∙开始和结束标签也被称为开放标签和闭合标签
∙与之间的文本描述网页
∙
与之间的文本是可见的页面内容∙
与
之间的文本被显示为标题∙
与
之间的文本被显示为段落例子：
任意字符
任意字符
HTML标题
HTML标题（Heading）是通过
-等标签进行定义的。
例子：
Thisisaheading
Thisisaheading
Thisisaheading
HTML段落
HTML段落是通过
标签进行定义的。
实例
Thisisaparagraph.
Thisisanotherparagraph.
HTML链接
HTML链接是通过标签进行定义的。
实例
HTML图像
HTML图像是通过标签进行定义的。
实例
HTML文档是由HTML元素定义的。
HTML元素
HTML元素指的是从开始标签（starttag）到结束标签（endtag）的所有代码。
开始标签
元素内容
结束标签
Thisisaparagraph
Thisisalink
注释：
开始标签常被称为开放标签（openingtag），结束标签常称为闭合标签（closingtag）。
HTML元素语法
∙HTML元素以开始标签起始
∙HTML元素以结束标签终止
∙元素的内容是开始标签与结束标签之间的内容
∙某些HTML元素具有空内容（emptycontent）
∙空元素在开始标签中进行关闭（以开始标签的结束而结束）
∙大多数HTML元素可拥有属性
提示：
您将在本教程的下一章中学习更多有关属性的内容。
嵌套的HTML元素
大多数HTML元素可以嵌套（可以包含其他HTML元素）。
HTML文档由嵌套的HTML元素构成。
HTML文档实例
Thisismyfirstparagraph.
上面的例子包含三个HTML元素。
HTML实例解释
元素：
Thisismyfirstparagraph.
这个
元素定义了HTML文档中的一个段落。
这个元素拥有一个开始标签
，以及一个结束标签
。元素内容是：
Thisismyfirstparagraph。
元素：Thisismyfirstparagraph.
元素定义了HTML文档的主体。这个元素拥有一个开始标签
，以及一个结束标签。元素内容是另一个HTML元素（p元素）。
元素：
Thisismyfirstparagraph.
元素定义了整个HTML文档。
这个元素拥有一个开始标签，以及一个结束标签。
元素内容是另一个HTML元素（body元素）。
不要忘记结束标签
即使您忘记了使用结束标签，大多数浏览器也会正确地显示HTML：
Thisisaparagraph
Thisisaparagraph
上面的例子在大多数浏览器中都没问题，但不要依赖这种做法。
忘记使用结束标签会产生不可预料的结果或错误。
注释：
未来的HTML版本不允许省略结束标签。
空的HTML元素
没有内容的HTML元素被称为空元素。
空元素是在开始标签中关闭的。
就是没有关闭标签的空元素（
标签定义换行）。
在XHTML、XML以及未来版本的HTML中，所有元素都必须被关闭。
在开始标签中添加斜杠，比如
，是关闭空元素的正确方法，HTML、XHTML和XML都接受这种方式。
即使
在所有浏览器中都是有效的，但使用
其实是更长远的保障。
HTML提示：
使用小写标签
HTML标签对大小写不敏感：
等同于
。
许多网站都使用大写的HTML标签。
W3School使用的是小写标签，因为万维网联盟（W3C）在HTML4中推荐使用小写，而在未来（X）HTML版本中强制使用小写。
HTML属性
HTML标签可以拥有属性。
属性提供了有关HTML元素的更多的信息。
属性总是以名称/值对的形式出现，比如：
name="value"。
属性总是在HTML元素的开始标签中规定。
属性实例
HTML链接由标签定义。
链接的地址在href属性中指定：
始终为属性值加引号
属性值应该始终被包括在引号内。
双引号是最常用的，不过使用单引号也没有问题。
在某些个别的情况下，比如属性值本身就含有双引号，那么您必须使用单引号，例如：
name='Bill"HelloWorld"Gates'
HTML标题
标题（Heading）是通过
-等标签进行定义的。
定义最大的标题。
定义最小的标题。
实例
Thisisaheading
Thisisaheading
Thisisaheading
HTML水平线
标签在HTML页面中创建水平线。
hr元素可用于分隔内容。
实例
Thisisaparagraph
Thisisaparagraph
Thisisaparagraph
HTML段落
段落是通过
标题定义的。
实例
Thisisaparagraph
Thisisanotherparagraph
HTML折行
如果您希望在不产生一个新段落的情况下进行换行（新行），请使用
标签：
Thisis
apara
graphwithlinebreaks
HTML超链接（链接）
超链接可以是一个字，一个词，或者一组词，也可以是一幅图像，您可以点击这些内容来跳转到新的文档或者当前文档中的某个部分。
当您把鼠标指针移动到网页中的某个链接上时，箭头会变为一只小手。
我们通过使用标签在HTML中创建链接。
有两种使用标签的方式：
1.通过使用href属性-创建指向另一个文档的链接
2.通过使用name属性-创建文档内的书签
HTML链接语法
链接的HTML代码很简单。
它类似这样：
实例
HTML链接-target属性
使用Target属性，你可以定义被链接的文档在何处显示。
下面的这行会在新窗口打开文档：
图像标签（）和源属性（Src）
在HTML中，图像由标签定义。
是空标签，意思是说，它只包含属性，并且没有闭合标签。
要在页面上显示图像，你需要使用源属性（src）。
src指"source"。
源属性的值是图像的URL地址。
定义图像的语法是：
URL指存储图像的位置。
如果名为"boat.gif"的图像位于的images目录中，那么其URL为
浏览器将图像显示在文档中图像标签出现的地方。
如果你将图像标签置于两个段落之间，那么浏览器会首先显示第一个段落，然后显示图片，最后显示第二段。
替换文本属性（Alt）
alt属性用来为图像定义一串预备的可替换的文本。
替换文本属性的值是用户定义的。
在浏览器无法载入图像时，替换文本属性告诉读者她们失去的信息。
此时，浏览器将显示这个替代性的文本而不是图像。
为页面上的图像都加上替换文本属性是个好习惯，这样有助于更好的显示信息，并且对于那些使用纯文本浏览器的人来说是非常有用的。
表格
表格由
| 标签定义）。 字母td指表格数据（tabledata），即数据单元格的内容。 数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。 | |
| row1,cell1 | row1,cell2 |
| row2,cell1 | row2,cell2 |
在浏览器显示如下：
row1,cell1
row1,cell2
row2,cell1
row2,cell2
表格和边框属性
如果不定义边框属性，表格将不显示边框。
有时这很有用，但是大多数时候，我们希望显示边框。
使用边框属性来显示一个带有边框的表格
表格的表头
表格的表头使用
在浏览器显示如下：
Heading
AnotherHeading
row1,cell1
row1,cell2
row2,cell1
row2,cell2
表格中的空单元格
在大多数浏览器中，没有内容的表格单元显示得不太好。
在浏览器显示如下：
row1,cell1
row1,cell2
row2,cell1
注意：
这个空的单元格的边框没有被显示出来。
（不过MozillaFirefox可以将整个边框显示出来。
）为了避免这种情况，在空单元格中添加一个空格占位符，就可以将边框显示出来。
在浏览器中显示如下：
row1,cell1
row1,cell2
row2,cell1
无序列表
无序列表是一个项目的列表，此列项目使用粗体圆点（典型的小黑圆圈）进行标记。
无序列表始于
- 标签。
- 。
- Coffee
- Milk
浏览器显示如下：
∙Coffee
∙Milk
列表项内部可以使用段落、换行符、图片、链接以及其他列表等等。
有序列表
同样，有序列表也是一列项目，列表项目使用数字进行标记。
有序列表始于
- 标签。
- 标签。
- Coffee
- Milk
浏览器显示如下：
1.Coffee
2.Milk
列表项内部可以使用段落、换行符、图片、链接以及其他列表等等。
定义列表
自定义列表不仅仅是一列项目，而是项目及其注释的组合。
自定义列表以
- 标签开始。
- 开始。
每个自定义列表项的定义以
- 开始。
- Coffee
- Blackhotdrink
- Milk
- Whitecolddrink
浏览器显示如下：
Coffee
Blackhotdrink
Milk
Whitecolddrink
定义列表的列表项内部可以使用段落、换行符、图片、链接以及其他列表等等。
HTML块元素
大多数HTML元素被定义为块级元素或内联元素。
编者注：
“块级元素”译为blocklevelelement，“内联元素”译为inlineelement。
块级元素在浏览器显示时，通常会以新行来开始（和结束）。
例子：
,
- ,
每个自定义列表项以
每个列表项始于
每个列表项始于
《雷雨》中的蘩漪人物形象分析 1.docx
