HTML入门笔记1

98 阅读2分钟

HTML 简史

Tim Berners-Lee是万维网的创始人,也是Web发展,W3C协调主体的指挥者,万维网联盟的主席。
1989年在欧洲核研究组织工作时,Berner-Lee发明了万维网。
1994年,Berners-Lee在MIT成立了W3C。
HTML 1.0——在1993年6月作为互联网工程工作小组(IETF)工作草案发布(并非标准):
HTML 2.0——1995年11月作为RFC 1866发布,在RFC 2854于2000年6月发布之后被宣布已经过时
HTML 3.2——1997年1月14日,W3C推荐标准
HTML 4.0——1997年12月18日,W3C推荐标准
HTML 4.01(微小改进)——1999年12月24日,W3C推荐标准
HTML 5——2014年10月28日,W3C推荐标准

HTML 基础知识

如何理解以下这段模板?

<!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 (或 XML)撰写

<!DOCTYPE html> 
是HTML5的专有写法
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
禁用缩放且兼容手机
<meta http-equiv="X-UA-Compatible" content="ie=edge">
这段代码表示如遇IE浏览器,IE8/9及以后的版本都会以最高版本IE来渲染页面。

章节标签

表示段落层级关系

  • 标题 h1~h6
  • 章节 section
  • 文章 article
  • 段落 p
  • 头 header
  • 脚 footer
  • 主要内容 main
  • 旁支内容 aside
  • 划分 div

全局属性

所有标签都有的属性

  • class
  • contenteditable
  • hidden
  • id 自己写样式的时候不要用id\color{red}{自己写样式的时候不要用id}
  • style
  • tabindex
  • title

内容标签

  • ol+li
  • ul+li
  • dl+dt+dd
  • pre
  • hr
  • br
  • a
  • em
  • strong
  • code
  • q
  • blockquote

如何检查HTML的正确性?

  1. vscode的代码提示,缺点是比较弱
  2. webstorm的代码提示,提示很强
  3. 使用w3c validator这个网站,复制代码去检查
  4. 用同等方式node-w3c-validator去检查,只不过需要提前安装java包在电脑内

HTML的符号和字符串的符号是两回事

  • HTML空格: "& n b s p ;"
  • 字符串空格: ' ' 或者 “\n”
  • 字符串的多个空格如果直接放到dom中是无法被识别多个的,只会展示一个而已

< !DOCTYPE html > 作用是什么?

  • 告诉浏览器当前页面是H5的规范
  • 告诉浏览器用标准模式去渲染而不是怪异模式
  • 比如在IE5的时候 盒模型是IE盒模型