HTML入门笔记1

96 阅读2分钟

HTML起源

HTML的英文全称是Hypertext Markup Language,即超文本标记语言。HTML是由WWW(即Worldwide Web)的发明者Tim Berners Lee爵士和同事Daniel W.Connolly于1990年创立的一种标记语言,它是标准通用化标记语言SGML的应用。


接下来简单介绍下HTML有关的知识内容

开发环境:VSCode

HTML起手式

!+tab 操作即可呈现一个最简单形式的网页内容框架,根据下面的截图,逐行解释下 微信图片_20220327142353.png

  1. <!DOCTYPE html>声明文件类型为html文件,浏览器内核可知这是一个html文件
  2. <html lang="en">声明页面语言为英文(lang即language的缩写),=右边的参数可以自己定,例如改成zh-CN即页面语言为简体中文
  3. charset="UTF-8"声明文件的字符编码为UTF-8格式
  4. content="IE=edge"声明如果内容在IE浏览器显示,则IE浏览器的内核需要是最新版本
  5. 第七行代码中的content里的内容表示页面禁止缩放
  6. 第八行中的title标签显示浏览器的标签名为"Document",标签里的内容可以随意修改
  7. <head>...</head>标签里的内容不对外展示,通常在这个标签里写必要的全局配置等对开发者重要对用户不重要的内容。
  8. <body>...</body>标签里的内容为主体内容,写对外展示用的代码

常用的表示章节的标签

  • 标题h1~h6
  • 章节section
  • 文章article
  • 段落p, 即paragraph的缩写
  • 头部header
  • 脚步footer
  • 主要内容(或主体)main
  • 旁支内容aside
  • 划分div,division( or divide)的简写

全局属性

全局属性即所有标签都有的属性

  • class
  • contenteditable
  • hidden
  • id
  • style
  • tabindex :=0表示摁tab访问标签的时候被最后访问到;=-1表示摁tab访问标签不会被访问到; 有多个大于0的tabindex值时,根据由小到大的顺序依次访问,数值不必要连续
  • title

常用的内容标签

  • ol+li: ordered list + list item
  • ul+li: unordered list + list item
  • dl+dt+dd: description list + term + data
  • pre: preview的缩写
  • hr: horizon (I guess...), 分割线
  • br: break的缩写
  • a: anchor的缩写,通常用来附上连接
  • em: emphasis的缩写,强调,通常是语气上的
  • strong:同为强调,但是实质上的
  • code: 代码块
  • q: quote的缩写
  • blockquote

参考资料

更权威具体的说明推荐查阅文档 MDN Web Docs
(开发不会查阅英语文档的程序员不是好程序员!!)
声明:这是一篇方便自己查阅的学习笔记,不具备权威性,不为任何使用上述内容进行开发导致的技术错误负责,具体的用法还请查阅权威网站