HTML初相遇本文主要用来记录学习HTML的过程及自我纠错和复习，还处在萌新学习阶段，难免有不对之处，还望指出。 Sir

本文主要用来记录学习HTML的过程及自我纠错和复习，还处在萌新学习阶段，难免有不对之处，还望指出。

一、HTML由谁发明

Sir Timothy John ＂Tim＂ Berners-Lee：一个获得过大英帝国爵级位勋章（2004）和图灵奖（2017）的大佬，关键是这位大佬还发明了www、http、html、url，所有前端程序员饭碗的由来。

二、为什么要学习HTML

我想混这碗饭吃，所以我来学了。

三、HTML起手式

在vscode中"!"回车即可得到以下代码，起手式完成。

<!DOCTYPE html>
<html lang="en"> 
   <head>   
     <meta charset="UTF-8" />   
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />  
     <meta http-equiv="X-UA-Compatible" content="ie=edge" />   
     <title>Document</title>
  </head> 
 <body></body>
 </html>

！ DOCTYPE html                          这个是文档类型，表明文件是html文件
<html lang="en">                         这个代表的是语文是英文，可以把lang改为lang=zh-CN
 <meta charset="UTF-8">                  这个代表的是文件的字符编码
<meta name="viewport" content="width=device-width, initial-scale=1.0">   这个代表的是禁用缩放，兼容手机的意思
content="ie=edge"                        这个表示告诉IE使用最新版的内核
title                                    这个表示文件的标题
<head>                                   写在head里面的东西一般都是看不见的元素

四、HTML常用的章节标签

标题：h1~h6 全文最多可以写出来6级标题
章节：section 表示这是一段章节
文章：artical 表示这是一段文章
段落：p 每一段的开头和结尾都加上p标签，可以很好的划分段落层次
头部：header 是放在顶部的，相当于页眉
尾部：footer 是放在底部的，相当于页脚，通常可以用来注释商标所有
主要内容：mian 用来提示说mian标签里面的内容是主要内容
旁支内容：aside 用来提示说aside标签里面的内容是旁支内容
划分：div 用来划分的

随手演示

五、HTML的全局属性

class ：可以把标签分类，标记一个class，如：<div class="middle boderd">
contenteditable ：可以编辑的意思，可以让网页的任何一个元素变得可被编辑。如：如何让style被看见，且可被编辑。首先要把style放在body里面，并写上： style{display:block}
hidden ：可以快速让让东西不被看见
id ：跟class的用途差不多，但是作为新手一般较少使用id标签（可以在javascript里直接通过id获取元素，但是元素里有一些禁忌，能不用就不用）
style：每一个元素可以写一个style属性（css，html，javascript属性同时存在时，以javascript的属性为最终效果）
tabindex ：可以用tab键来切换网页内容。tabindex的选择顺序是tabindex=1.2.3这样按照顺序排列的。tabindex=-1表示tab永远不要来访问这个地方。tabindex=0表示tab是最后一个来访问的地方。

tabindex = -1：别访问我

tabindex = 0：最后一个访问我

tabindex 正数：顺序访问

7.title ：用来显示提示的，在一行文字中如果没有办法把文字显示完整，可以设置title，让鼠标移动到文字的上方，这样就可以让title里面的字显示出来。需要如下代码

whit-space:nowrap;
overflow:hidden;
text-overflow:ellipists

六、HTML常用的内容标签

ol+li 表示有顺序的列表（只能写在li里面，否则不显示）

2.ul+li 表示没有顺序的列表

3.dl+dt+dd 描述列表可以按快捷键dl+tab键快速呼出代码

4.pre：在html中，连续多个空格（或者tab）会被缩成一个空格，回车会变成一个空格，用 pre标签包起来空格就可以保留。

使用前

使用后

5.hr 用来做分割线，划分之前和之后，注意内容要写在hr的上面

6.br 用来换行

7.a 用来添加链接（又分在当前页面打开和在新页面打开链接）

8.em 用来强调（注重语气）

9.strong 用来重要强调（注重本身）

10.quote 内联引用

11.blockquote 块级引用

12.code 用来改变字体格式，变成等宽字体

注：em标签和strong标签有什么区别

1.em表示语气上的强调

2.strong表示内容本身的重要性

©本次分享结束，谢谢观看.