HTML页面基本结构及主要标签

￡神魔★判官ぃ 2024-03-26 10:40 62阅读 0赞

![9deec9aa0968440ce1b6211e66a8ead1.jpeg][]

之前介绍了HTML的编码规范，良好编码规范可以让我们的代码更加的易于维护，而今天要说的基本结构，则是能够让我们的页面正确的进行页面显示和SEO，正确的HTML格式加上良好的编码规范才是一个成熟合格的项目。

HTML页面基本结构

<!DOCTYPE html><html>  <head>    <meta charset="utf-8">    <title></title>  <head>  <body></body></html>

HTML的页面结构非常简单，整体分为两部分，第一部分为DOCTYPE模块，第二部分为html模块。

DOCTYPE模块

文档声明，位于页面的首行，告知浏览器使用哪种HTML版本规范方式解析网页，使网页能正常显示。

html模块

告诉页面这是一个html文档。

在<html>部分中，又分为两小部分，第一部分为head模块，第二部分为body模块。

head模块

如果用人体的结构来类比的话，这部分属于网页的头部，这部分中描述了HTML文件的各种属性和信息，如网页的标题，字符编码，是否启用缓存，引用的外部脚本和样式等等。在这head标签里写的内容不会在网页的正文内容中显示出来。

body模块

HTML的主体，网页的文本、超链接、图像、表格、视频等所有在网页上显示的内容都写在这里。

title标签

在head标签中title标签表示网页的标题。meta标签-提供有关页面的元信息，比如针对搜索引擎的关键字、缓存时间、启用浏览器内核等等，meta标签有两个主要属性name和http-equiv。

meta标签name属性

主要用于描述网页，比如定义网页的关键词，关键内容、标注作者、版权等。

**格式：**

常用name属性值**keywords**——用于告诉搜索引擎网页的关键字。

**description**——用于告诉搜索引擎网站的主要内容。

**robots**——用来告诉爬虫哪些页面需要索引，哪些页面不需要索引。

**author**——用于标注网页的作者信息。

**generator**——用于标注网页是用什么IDE做的。

**copyright**——用于标注版权信息。

**renderer**——用于指定双核浏览器默认以什么方式进行页面渲染content="webkit"为webkit内核，content="ie-comp"为IE兼容模式，content="ie-stand"为IE标准模式。

meta标签http-equiv属性主要用于设置网页的字符集，缓存机制等。**格式：**

常用http-equiv属性值**content-type**——设定网页字符集。

**X-UA-Compatible**——用于告知浏览器以什么种版本来渲染页面。

**cache-control**——设置浏览器如何缓存某个响应以及缓存多长时间。

**Set-Cookie**——设置cookie设定。

来源：[https://www.weidianyuedu.com][https_www.weidianyuedu.com]

[9deec9aa0968440ce1b6211e66a8ead1.jpeg]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/26/ca97a35d99f341a7b63d3169f10ffe82.png
[https_www.weidianyuedu.com]: https://www.weidianyuedu.com

HTML页面基本结构及主要标签

发表评论取消回复

还没有评论，来说两句吧...

相关阅读

相关 html简介及基本标签

相关 HTML页面基本结构及主要标签

相关 HTML页面基本结构学习

相关 HTML主要标签

相关 HTML页面基本结构

相关【HTML5】初识前端页面结构与基本标签

相关 html基本标签

相关 Jsoup获取一个HTML页面的基本标签、Java解析HTML标签

相关 HTML基本标签

相关 html---基本标签