1.HTML网页结构化框架代码示例
myhtml.html
<!--文档声明，声明当前网页的版本-->
<!DOCTYPE html>
<!--html的根标签（元素），网页中的所有内容都要写在根元素的里边-->
<html lang="en">
<!--head是网页头部，head中的内容不会在网页中直接出现，主要用来帮助浏览器或搜索引擎来解析网页-->
<head><!--meta标签用来设置网页的元数据，这里meta用来设置网页的字符集，避免乱码问题--><meta charset="UTF-8"><!--title中的内容会显示在浏览器的标题栏，搜索引擎会主要根据title中的内容来判断网页的主要内容--><title>大土土随笔</title>
</head>
<!--body是html的子元素，表示网页的主体，网页中的所有可见的内容都应写在body里面-->
<body><!--h1网页的一级标题--><h4>这是我的网站首页</h4>
</body>
</html>
用浏览器打开，效果如下：
2.HTML meta标签代码示例
myhtml2.html
<!--文档声明，声明当前网页的版本-->
<!DOCTYPE html>
<!--html的根标签（元素），网页中的所有内容都要写在根元素的里边-->
<html lang="en">
<!--head是网页头部，head中的内容不会在网页中直接出现，主要用来帮助浏览器或搜索引擎来解析网页-->
<head><!--meta标签用来设置网页的元数据，元数据不是给用户看的charset 指定网页的字符集，避免乱码问题name 指定的数据的名称http-equiv="refresh" 将页面重定向到另一个网站content 指定的数据的内容keywords 表示网站的关键字，可以同时指定多个关键字，关键字间使用英文,隔开description 用于指定网站的描述title标签的内容会作为搜索结果的超链接上的文字显示--><meta charset="UTF-8"><meta name="keywords" content="Python,Linux,C++,MySQL,镜像,工具软件,CTF,单片机,驱动源码,源代码"><meta name="description" content="发布Python、Linux、C++、MySQL等技术教程和自己开发的工具软件以及程序源代码！"><!--将页面重定向到另一个网站--><meta http-equiv="refresh" content="3;url=http://www.datutusuibi.com/"><!--title中的内容会显示在浏览器的标题栏，搜索引擎会主要根据title中的内容来判断网页的主要内容--><title>大土土随笔</title>
</head>
<!--body是html的子元素，表示网页的主体，网页中的所有可见的内容都应写在body里面-->
<body><!--h1网页的一级标题--><h4>这是我的网站首页</h4><!--在新浏览器页面打开网址--><a href="http://www.datutusuibi.com/" target="_blank">大土土随笔</a>
</body>
</html>
用浏览器打开，效果如下：
3.HTML 语义化标签代码示例
myhtml3.html
<!--文档声明，声明当前网页的版本-->
<!DOCTYPE html>
<!--html的根标签（元素），网页中的所有内容都要写在根元素的里边-->
<html lang="en">
<!--head是网页头部，head中的内容不会在网页中直接出现，主要用来帮助浏览器或搜索引擎来解析网页-->
<head><!--meta标签用来设置网页的元数据，元数据不是给用户看的charset 指定网页的字符集，避免乱码问题name 指定的数据的名称http-equiv="refresh" 将页面重定向到另一个网站content 指定的数据的内容keywords 表示网站的关键字，可以同时指定多个关键字，关键字间使用英文,隔开description 用于指定网站的描述title标签的内容会作为搜索结果的超链接上的文字显示--><meta charset="UTF-8"><meta name="keywords" content="Python,Linux,C++,MySQL,镜像,工具软件,CTF,单片机,驱动源码,源代码"><meta name="description" content="发布Python、Linux、C++、MySQL等技术教程和自己开发的工具软件以及程序源代码！"><!--将页面重定向到另一个网站<meta http-equiv="refresh" content="3;url=http://www.datutusuibi.com/">--><!--title中的内容会显示在浏览器的标题栏，搜索引擎会主要根据title中的内容来判断网页的主要内容--><title>大土土随笔</title>
</head>
<!--body是html的子元素，表示网页的主体，网页中的所有可见的内容都应写在body里面-->
<body><!--标题标签：h1~h6一共六级标题从h1~h6递减，h1最重要，h6最不重要h1在网页中的重要性仅次于title标签，一般情况下标题标签只会使用到h1~h3，h4~h6很少用。标题标签都是块元素在页面中独占一行的元素称为块元素--><h1>一级标题</h1><h2>二级标题</h2><h3>三级标题</h3><h6>六级标题</h6><br><br><br><!--hgroup标签用来为标题分组，可以将一组相关的标题同时放入hgroup--><hgroup><h3>回乡偶书二首</h3><h4>其一</h4></hgroup><h4>唐 贺知章</h4><!--p标签表示页面中的一个段落，p也是一个块元素--><!--q标签表示一个短引用blockquote标签表示一个长引用strong表示强调，重要内容br标签表示页面中的换行--><p>少小离家老大回，<br>乡音无改鬓毛衰。<br>儿童相见不相识，<br>笑问客从何处来。<br></p></body>
</html>
用浏览器打开，效果如下：
获取更多资料，请访问大土土随笔
如果本文对您有所帮助，请关注微信公众号“捷创源科技”！
)
