HTML 概览

夜之际
227 阅读3分钟

1990年 李爵士 发明了万维网 WWW=URL+HTTP+HTML，用于上网冲狼

  • 1995年 马云 从美国带回了网页

  • 1999年 创办阿里巴巴

  • 2003年 创办了淘宝

  • 2004年 创办了支付宝

  • 1995~2000年 美国.com 泡沫，中国发展慢，所以当时没出现

  • 1998年11月 腾讯成立

  • 2000年1月 百度成立

目前的 BAT 都极大依赖于 WWW

前端与后端 都依赖 WWW

前端的本质是共享

如何制作出网页：

  • 域名知识：URL+HTTP+HTML

  • HTTP 服务器知识

  • HTML 知识

  • 其他

1996年底 CSS 发布

1995年底 JavaScript 发布

HTML 诞生于李爵士的一篇文章 HTML Tags

最原始的HTML 只有18个标签

最新版的 HTML 有110个标签

HTML 权威资料：MDN HTML5，用谷歌搜索

不要去W3School

HTML5 有两个含义：

  • 新增的32个新标签和旧标签
  • HTML5 和它的朋友们，包括CSS3

HTML5 技术集合

  • 新标签、新属性
  • 新的通信技术：WebSockets、WebRTC等（用的不多）
  • 离线存储技术：LocalStorage（面试经常考）、断网检测
  • 多媒体技术：视频、音频
  • 图像技术：Canvas、SVG、WebGL
  • Web增强技术：摄像头、触摸屏
  • 新的样式技术：CSS3 新的Flex、Grid布局方式

H5 不指 HTML5，是指手机页面

优先学习HTML5的必学的30个标签：

元数据

  • meta

章节

  • section
  • nav
  • artical
  • aside
  • header
  • footer
  • main

内容层次

  • ol + li
  • ul + li
  • dl + dt + dd

文字

  • a

嵌入内容

  • img
  • video
  • canvas
  • svg

表格

  • table
  • tbody
  • thead
  • tfoot
  • tr
  • td
  • th

表单

  • form
  • label
  • input
  • button
  • select
  • option
  • textarea

可交互元素

正确的学习方法：

体系化学习

学习一门语言必须学会什么：

  • 语法（怎么写代码）
  • 如何调试（怎么知道自已代码写错了）
  • 在哪查资料（其实就是为了方便抄代码）
  • 标准制定者是谁—— W3C（跟w3school不一样）

如何学：

  • Copy——抄文档、抄老师
  • Run——放在自已机器上运行成功
  • Modify——加入一点自已的想法，然后重新运行 简称 CRM 学习法

HTML 的语法：

标签：

<!DOCTYPE html> —— 文档类型
<tag attr=value>内容</tag>
<tag attr>内容</tag>
<tag attr=value />

注：1. checked不看后面的语法，
如：<input type="checkbox" checked="false"> 也是打勾，删除 false 也是打勾
    2. 闭合
    <link rel="stylesheet" href="xxx.css" /> 旧的XML写法
    <link rel="stylesheet" href="xxx.css">   新版本的写法

细节：

  • 大小写有区别 —— 尽量使用小写
  • 要加引号？ —— 没有特殊字符的话可以不加，有的话要加（单双引号都可以）
  • 如何注释 —— Ctrl+/
  • 如何组合

HTML 排错

  • 看 VSCode 的颜色提示 —— 大部分时候看不出来
  • 看 WebStorm 的颜色提示 —— 基本是能看到问题点
WebStorm 使用条件
容忍打开项目要十秒以上
内存 4G 以上
用 SSD固态硬盘

不用网站上查的方法：

先在 Cmder 里输入下面2行命令行：
yarn global add node-w3c-validator
node-w3c-validator --version

然后在 VSCode 终端命令上输入下行验证：
node-w3c-validator -i index.html

在哪查资料

用Google上输入：mdn 标签

avatar
文章
阅读
粉丝