1, 什么是HTML?
HTML是一种超文本语言,什么是超文本呢?其实就相当于网页中的链接,我们打开可以跳转到相应的网页。
2,HTML的基本结构
一个HTML文件通常是由一系列的元素和标签组成的,标签为带尖括号的内容,如<body>,用来规定元素的属性和他在文件中的位置。
1,标签
- 单独标签:单独标签的格式为<元素名称>,作用是在相应位置插入元素。如:<br>标签就是单独出现的标签,意思是在该标签所在位置插入一个换行符。
- 成对标签:由首标签和尾标签组成的。首标签格式为<元素名称>,尾标签格式为</元素名称>语法格式为:<元素名称>要控制的元素</元素名称>。
- 在每个HTML标签中,还可以设置一些属性,用来控制HTML标签所建立的元素,这些属性位置在首标签里。
因此,首标签的语法如下:
01 <元素名称 属性值1=“值1” 属性值2=“值2”...>
尾标签的语法如下(无需更改):
01 </元素名称>
因此,某个元素的完整定义语法如下:
01 <元素名称 属性值1=“值1” 属性值2=“值2”...>要控制的元素</元素名称>
2,元素
- 像上面某个元素的完整定义语法那样,用一组HTML标签讲一段文字包含在中间时,这段文字和包含着他的标签就是一个元素。
- 在HTML语法中,每个元素 内还可以包含另一个元素,因此整个HTML文件就像是一个大元素包含了许多小元素。
- 在HTML中,最外层的元素是由<html>标签建立的,而其中又包含了两个主要的子元素,分别是<head>标签和<body>标签,前者建立的元素内容为文件标题,后者建立元素内容为文件主体。
3,文件结构
<html>
<head>
<title>文件标题<title>
</head>
<body>文件正文</body>
</html>
其中1行是:文件开始
3和5:头文件,用来说明文件的标题和整个文件的一些公共属性。(存放给浏览器看的代码,如CSS)
4:文件标题,养成良好的代码习惯应该在每个HTML标题中注明内容。
7:文件体,基本上所有的标签都是嵌套在这一对标签中使用的。(给用户看的代码)
8:文件结束
3,HTML 的基本标签
1,文件开始标签<html>
- 在任何一个HTML文件里最先出现的标签就是<html>,用来表示该文件时以超文本标识语言HTML编写的。 <html>标签是成对出现的,首标签和为标签分为位于文件的第一行和最后一行,文件所有的元素和标签都内包含其中。
- <html>标签不带任何属性。
2,文件头部标签<head>
- 是表示网页头部的标签,放置关于HTML文件的信息,并不属于HTML文件的主体部分,它包含文件的标题、编码方式和URL等信息,这些信息大部分是用于提供索引、辨认或其他方面的应用。
- 写在<head></head>中间的文本,如果又写在了<title>标签中,那么表示该网页的名称,并作为窗口的名称显示在这个网页窗口的最上方。
另:如果HTML文件并不需要提供相关信息时,可以忽略<head>标签。
3,文件标题标签<title>
- 每个HTML都需要有一个文件名称。在浏览器中,文件名称作为窗口名称显示在该窗口上方。
- 网页的名称要写在<title>和</title>之间,并且<title>标签应嵌套包含在<head>和</head>标签之中。
4,元信息标签<meta>
- meta元素提供的信息是用户不可见的,不显示在页面中,一般用来定义页面信息的名称、关键字、作者等。在HTML中,meta标记不需要设置结束标记,在一对尖括号内就是一个meta内容,一个网页中可以有多个meta元素。
- meta元素的属性有两种:name 和 http-equiv。前者用来描述网页,以便于搜索引擎机器人查找分类,后者用于模拟服务器发送的原始HTTP头信息,它影响整个页面的行为和信息的发送方式。
5,页面主体标签<body>
<body>标签是成对出现的,一下是一些常用的属性设置:
属性 | 描述 |
text | 设置页面文字颜色 |
bgcolor | 设置页面背景颜色 |
background | 设置页面的背景图像 |
bgproperties | 设置页面背景图像为固定,不随页面的滚动而滚动 |
link | 设置页面默认的链接颜色 |
alink | 设定鼠标正在单击时的链接颜色 |
vlink | 设定访问过后的链接颜色 |
topmargin | 设定页面的上边距 |
leftmargin | 设定页面的左边距 |
6,页面的注释
在网页中,还有一种不显示在页面中的元素,即为注释文字,适当的注释可以帮助用户更好的了解网页中各个模块的划分,也有助于以后对代码的检查和修改。给代码添加注释是一种很好的编程习惯,大家在写语言时可以多培养这种习惯。
在HTML文档中,注释有三类:1,在文件开始标签<html>和结束标签</html>中的注释。
2,在CSS样式中的注释。
3,在JavaScript中的注释。(分为单行注释和多行注释)
以下分别介绍具体语法,(只需要在“注释的文字”这个位置上添加需要的内容即可):
- 在文件开始标签<html>和结束标签</html>中的注释:
01 <!--注释的文字-->
- 在CSS样式中的注释;
01 /*注释的文字*/
- 在JavaScript中的注释:
- 单行注释
01 //注释的文字
- 多行注释
01 /*注释的文字*/