HTML页面基本结构浅谈

转载自品略图书馆 http://www.pinlue.com/article/2019/10/1815/569718577858.html

正确的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属性

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

格式：

<meta name="属性值" content="描述内容"/>

常用name属性值keywords——用于告诉搜索引擎网页的关键字。description——用于告诉搜索引擎网站的主要内容。robots——用来告诉爬虫哪些页面需要索引，哪些页面不需要索引。author——用于标注网页的作者信息。generator——用于标注网页是用什么IDE做的。copyright——用于标注版权信息。renderer——用于指定双核浏览器默认以什么方式进行页面渲染content="webkit"为webkit内核，content="ie-comp"为IE兼容模式，content="ie-stand"为IE标准模式。

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

<meta http-equiv="属性值" content="参数"/>

常用http-equiv属性值content-type——设定网页字符集。X-UA-Compatible——用于告知浏览器以什么种版本来渲染页面。cache-control——设置浏览器如何缓存某个响应以及缓存多长时间。Set-Cookie——设置cookie设定。

END

HTML页面基本结构浅谈相关推荐

list vue 删除后页面渲染_浅谈Vue项目实战（页面渲染+事件绑定）
页面渲染 vue是不会去操作dom节点,是有数据去操控节点,在js文件数据都在data里 *js代码片* export default { data() { return { formInline: ...
微信html页面缓存问题,浅谈微信页面入口文件被缓存解决方案_简单_前端开发者...
缓存对于前端页面来说,是加速页面加载的利器之一,但也同时带来了很多问题,比如新版本发布之后,怎么替换客户端上的缓存文件呢?大家一般的的解决方案主要有以下几种形式, 一般情况 1.添加版本号,在静态 l ...
微信小程序页面栈_浅谈下微信小程序中的路由(页面跳转、返回、刷新、页面栈)...
什么是小程序里的"路由"?路由器吗?蒙蔽?好吧,在WEB应用中它其实就是分组数据包从源到目的地时,决定端到端路径的网络范围的进程:在小程序里就是设置页面的跳转,返回,自动刷新等一些 ...
html 获取页面元素高度,浅谈JavaScript获取元素的大小（高度和宽度）的方法
本篇文章给大家介绍一下JavaScript获取元素的大小(高度和宽度)的方法.有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助. 在 JavaScript 中,使用下面 3 组属性可以获 ...
浅谈HTTPS通信机制和Charles抓包原理-by:nixs
转载请注明出处:https://blog.csdn.net/zwjemperor/article/details/80719427 主页:https://blog.csdn.net/zwjempero ...
浅谈“三层结构”原理与用意(转帖)
浅谈"三层结构"原理与用意序在刚刚步入"多层结构"Web应用程序开发的时候,我阅读过几篇关于"asp.net三层结构开发"的文章.但其多 ...
Unity iOS打开AppStore评星页面，浅谈Application.OpenURL()方法。
http://fairwoodgame.com/blog/?p=38 Unity iOS打开AppStore评星页面,浅谈Application.OpenURL()方法. Posted in Uni ...
java对象头_浅谈java对象结构对象头 Markword
概述对象实例由对象头.实例数据组成,其中对象头包括markword和类型指针,如果是数组,还包括数组长度; | 类型 | 32位JVM | 64位JVM| | ------ ---- | ----- ...
页面显示 amp html6,浅谈HTML5 amp;amp; CSS3的新交互特性
本文标题的这副图片,是用Phosotshop制作的.但是,在搜索引擎中你却无法搜索到它,搜索引擎还没有强大到能够识别图片里面的文字.并且由于图片的体积不算太小,可能网速慢的网友在浏览的时候不得不耐心的 ...
js 单页面ajax缓存策略,浅谈ajax的缓存机制---IE浏览器方面
这篇文章主要介绍了IE浏览器关于ajax的缓存机制,文中给大家提到了Ajax解决浏览器的缓存问题,解决方法有很多种.有一定的参考价值,有需要的朋友可以参考一下,希望对你们有所帮助. IE浏览器对于同一 ...

HTML页面基本结构浅谈

HTML页面基本结构浅谈相关推荐

最新文章

热门文章