整合营销服务商
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
HTML5是新的HTML标准，是对HTML和XHML的继承和发展。学习HTML5首先需要了解HTML5的语法基础。本章将围绕HTML5文档基本格式、HTML5语法来进行讲解。
下面是HTML5最基本的代码结构：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
</body>
</html>1.<!doctype>标记
<!doctype>标记位于文档的最前面，用于向浏览器说明当前文档使用哪种HTML标准规范。只有在开头使用<!doctype>声明，浏览器才能将该网页作为有效的HTML文档，并按指定的文档类型进行解析。使用HTML5的DOCTYPE声明，会触发浏览器以标准兼容模式来显示页面。
2.<html>标记
<html>标记位于<!doctype>标记之后，也称为根标记，用于告知浏览器其自身是一个HTML文档。<html>标记标志着HTML文档的开始，</html>标记表示HTML文档的结束。他们之间是文档的头部和主体内容。
3.<head>标记
<head>标记用于定义HTML文档的头部信息，也称头部标记，是用来封装其他位于文档头部标记的标记，如：<meta>、<title>、<link>、<style>、<script>标记等。上面的代码中，<meta>标记的属性charset指的是文档的字符编码，“utf-8”表示国际通用字符编码。<title>标记用于告诉用户这个页面是什么，如：百度页面，在浏览器导航栏的最上方百度所属页面，会有一个百度的标题。<link>标记一般用来引入外部的CSS文件。<style>标记用来包裹与html标签对应的CSS样式，通常与选择器结合起来使用。<script>标记用于引入外部的JavaScript（js）文件，如果<script>标记位于<body>标记中，就可以将js代码写在<script>标记中。
注意：一个HTML文档中只能包含一对<head>标记，绝大多数文档头部包含的数据都不会真正作为内容显示在页面中。
部分标记会在下一章节进行详细解释
4.<body>标记
<body>标记用于定义HTML文档所要显示的内容，也称为主体标记。浏览器中显示的所有文本、图像、音频和视频等信息都必须位于<body>标记内，<body>标记中的内容才是最终展示给用户看的。
一个HTML文档只能包含一对<body>标记，且必须位于<html>标记内部，<head>标记的后面，与<head>标记是并列关系。
1.标签不区分大小写
为了兼容各个浏览器，HTML5采用宽松的语法格式，标签可以不区分大小写就是HTML5语法变化的重要体现
<p>开始标记的p标记小写，结束标记的p标记大写</P>上面的代码标签的开始和结束标签大小写虽然不同，但它是符合HTML5语法的规范的。
2.允许属性值不使用引号
在HTML5中，属性值不放在引号中也是正确的，如：
<input type=text readonly=readonly/>
<input type=checkbox checked=a/>这段代码等价于：
<input type="text" readonly="readonly"/>
<input type="checkbox" checked="a"/>3.允许部分属性值的属性省略
在HTML5中，部分标志性的属性的属性值是可以省略的，如：
<input type="text" readonly="readonly"/>
<input type="checkbox" checked="checked"/>
可以省略为：
<input type="text" readonly/>
<input type="checkbox" checked/>下面是一张关于HTML5可以省略属性值的属性表：
提示：虽然HTML5对于语法的规范不是很严格，但是个人建议，标签采用小写，引号加上，这两点是为了让页面看起来美观，也是为了方便后面页面编写出错时找错。
tml:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>下拉菜单</title>
<link href="../css/20240401-2.css" rel="stylesheet">
</head>
<body>
<div class="container">
<ul>
<li>Home</li>
<li>Services
<ul>
<li>Web Design</li>
<li>Mobile App
<ul>
<li>iOS App</li>
<li>Android</li>
</ul>
</li>
<li>Advertising</li>
</ul>
</li>
<li>Blog</li>
<li>About US</li>
<li>Contact Us</li>
</ul>
</div>
</body>
</html>Css:
*{
margin: 0px;
padding: 0px;
}
body{
display: flex;
background-color: #1769b0;
justify-content: center;
margin-top: 20px;
}
.container ul{
list-style: none;
}
.container ul li{
background-color: transparent;
width: 150px;
border: 1px solid white;
height: 50px;
line-height: 50px;
text-align: center;
float: left;
color: #fff;
font-size: 19px;
position: relative;
}
.container ul li:hover{
background-color: #85C1E9;
}
.container ul ul{
display: none;
}
.container ul li:hover > ul{
display: block;
}
.container ul ul ul{
margin-left: 150px;
top: 0px;
position: absolute;
}效果：
多刚入门HTML5前端开发的小伙伴对HTML页面的基本机构代码还不是很清楚，下面和千锋广州小编一起来看看吧。
1、什么是标签：
html标签组成是html文档的最基本元素,一般是成对出现,由开始标签和与其对应的结束标签构成.?如<html></html>，<p></p>，<body></body>，<head></head>，<span></span>等,此外，还有一些标签是单独出现的，如<img/>,<input/>等，标签可以相互嵌套使用。
由于html语言是一门弱类型语言,对格式的要求不是非常严格，因此所有标签是不区分大小写的,但是，一般在实际开发中，大家都统一使用小写。
2、html文档的基本结构
如上图，每一个html文档的基本结构为：
第一层：
<!DOCTTYPE>------！文档类型，它的目的是要告诉标准通用标记语言解析器，它应该使用什么样的文档类型定义（DTD）来解析文档，在html5文档中，一般写为<!DOCTTYPE html> ;值得注意的是，<!DOCTTYPE>不属于html标签。
<html></html>-------html标签，是html文档的根标签，所有的网页标签都放在这对标签中，是所有html标签的祖先容器。
第二层：
<head></head>-------头部标签，代表着html文档的头信息，是所有头部元素的容器，内部一般包含：<title> <script><style><meta><link>这些头部元素。
<body></body>-------网页主体标签，其内部主要包含着构成网页内容的一些元素，如<p></p>,<span></span>,<div></div>,<table></table>等。这些元素都会在网页的内容部分显示。
3、标签的属性
就如人有这身高、体重、年龄等这些属性一样，html标签也有自己的属性，如字体颜色，宽，高，背景等。这些属性一般通过键值对的形式卸载标签中，是标签的一部分，并且每种标签的属性都不完全像同，有的标签有着自己特有的属性。如下图所示：
4、html注释
在实际开发中，我们需要在html文档中做一些标记，方便日后对代码的维护及修改，也方便其他程序员了解我们的代码。而在html文档中，注释的格式为:
我们可以理解为，html中，标签元素是给计算机读的，为注释是给程序员看的。
以上就是今天分享的内容，希望对大家有帮助哦！
*请认真填写需求信息，我们会在24小时内与您取得联系。
