html学习之路1-CSDN博客

本文链接：https://blog.csdn.net/weixin_44855464/article/details/102863560

<!DOCTYPE HTML>
<html lang="en">
  <head>
    <meta charest="UTF-8">
    <mete name="viewreport" content="width=device-width,initial-scale=1.0">
    <mete http-equiv="X-UA_Compatible" content="ie=edge">
    <title>个人主页</title>
  </head>
<body>
<h1>个人简历</h1>
 <h2>基本信息</h2>
  <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Eligendi quasi quam fugiat. Ea quae excepturi nihil blanditiis temporibus, distinctio omnis, nostrum quibusdam, laborum dignissimos provident rerum! Error laboriosam suscipit nulla?</p>
 <h3>早年经历</h3>
  <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Omnis porro sunt, eaque ipsa qui nisi at, rem quas, repudiandae praesentium facilis esse culpa illum eveniet doloribus labore distinctio dolorum unde?</p>
 <h4>个人生活</h4>
  <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Quis corporis natus, error molestiae harum quam voluptatibus magnam! Sit nemo quo eligendi esse aspernatur. Quia blanditiis ducimus repellat hic porro id.</p>
</body>
</html>

效果图
HTML文档都是由HTML元素定义
HTML元素语法：
1.以开始标签起始 < p>
2.以结束标签结束 < /p>
3.开始标签和结束标签中间是元素内容
4.某些html元素具有空内容的，如：
< br /> 标签插入简单的换行符。
< br /> 标签是一个空标签，意味着它没有结束标签。所以这样是错误的：
< br>< /br>
5.空元素的标签在开始标签中关闭，如< br />
6.大多html元素是具有属性的
注1：HTML 标签对大小写不敏感，如< p>和< P>没区别，在HTML5版本中，W3C明确规定，标签必须用小写格式。而新的XHTML规范里也必须是小写。所以应该是小写正规。
注2：即使忘记使用结束标签，大多数浏览器也会正确地显示HTML。但不要依赖这种做法，忘记使用结束标签会产生不可预料的结果或错误。在现在的html版本中，是不允许省略结束标签的。

代码详解

1.<!DOCTYPE HTML>
<!DOCTYPE > 声明必须是 HTML 文档的第一行，位于 ``标签之前。
<!DOCTYPE > 声明不是 HTML 标签；它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令,请始终向 HTML 文档添加 <!DOCTYPE> 声明，这样浏览器才能获知文档类型,代码中的 <!DOCTYPE HTML> 为html5的声明。
2.<html>元素
<html> 元素定义了整个 HTML 文档。
这个元素拥有一个开始标签<html>，以及一个结束标签 <html>。
元素内容是另一个 HTML 元素（head元素）

<html lang="en">`：lang是\<html>这个标签的属性，规定元素内容的语言代码，这里en代表英文，zn-CN代表中文。

注：大多数 HTML 元素可以嵌套（可以包含其他 HTML 元素）。HTML 文档由嵌套的 HTML 元素构成。
3.<head> 标签
<head> 标签用于定义文档的头部，它是所有头部元素的容器。中的元素可以引用脚本、指示浏览器在哪里找到样式表、提供元信息等等。文档的头部描述了文档的各种属性和信息。
meta是html语言head区的一个辅助性标签
meta标签的组成：meta标签共有两个属性，它们分别是http-equiv属性和name属性，不同的属性又有不同的参数值，这些不同的参数值就实现了不同的网页功能，
在 HTML 中，<meta> 标签没有结束标签。
在 XHTML 中，<meta> 标签必须被正确地关闭。
<meta> 标签永远位于 head 元素内部。

<meta charest="UTF-8">`:表示这个网页采用UTF-8编码格式，UTF-8是世界的统一编码格式。

<mete name="viewreport" content="width=device-width,initial-scale=1.0">`:
viewreport：它提供有关视口初始大小的提示，仅供移动设备使用。
width:可视区域的宽度，值可为数字或关键词**device-width（为输出设备的屏幕可见宽度）**
initial-scale:页面首次被显示是可视区域的缩放级别，取值1.0则页面按实际尺寸显示，无任何缩放。

name属性主要用于描述网页，与之对应的属性值为content，content中的内容主要是便于搜索引擎机器人查找信息和分类信息用的。
meta标签的name属性语法格式是： <meta name="参数"content=“具体的参数值”>

<mete http-equiv="X-UA_Compatible" content="ie=edge">
X-UA-Compatible 用于强制浏览器的渲染方式，按照IE该浏览器的最新版本来渲染。

http-equiv属性，相当于http的文件头作用，它可以向浏览器传回一些有用的信息，以帮助正确和精确地显示网页内容，与之对应的属性值为content，content中的内容其实就是各个参数的变量值。

<title>个人主页</title>:
<title> 定义文档的标题，它是 head 部分中唯一必需的元素。

4.<body> 元素
<body> 元素定义了 HTML 文档的主体。
这个元素拥有一个开始标签 <body>，以及一个结束标签<body>。
元素内容是另一个 HTML 元素（h1元素）。
5.<h1>元素
h标签:<h1> </h1> ~<h6> </h6>等双标签表示一个文章的各种标题
在一个网页中，h1标题最重要，并且一个.html文件中只能出现一次h1标签。
h5,h6标签在网页中不经常使用，可以多次使用h2等标签。
6.<p>元素
表示段落