<!DOCTYPE html> <!-- HTML HTML 页面结构 CSS 样式 Javascript 行为，交互 HTML 常见元素 HTML 元素分类 HTML 元素嵌套关系 HTML 元素默认样式和定制化 真题 1. HTML 常见元素 --> <head> 页面的描述信息，其中包含的元素 meta <meta charset="utf-8"> //指定字符集 <meta name="viewport" content="width=device-width, initial-scale=1.0"> //视窗自适应设备 title style link script base <base href="/"> //指定基础路径 </head> <body> 页面展示信息 div/section/article/aside/header/footer p span/em/strong table/thead/tbody/tr/td ul/ol/li/dl/dt/dd a form/input/select/textarea/button </body> 2.HTML 重要属性 a[href,target] img[src,alt] table,td[colspan,rowspan] form[target,method,enctype,action] input[type,value] button[type] select>option[value] label[for] 3.如何理解 HTML HTML "文档" 描述文档的"结构" 有区块和大纲 在设计时不同的标签有不同的语义，在设计时最好尽力让整个结构清晰 4.HTML 版本 HTML4/4.01(SGML)SGML 在 GML 的基础上进行整理，形成了一套非常严谨的文件描述方法。它的组成包括语法定义，DTD，文件实例三部分。SGML 因太严谨规范达500多页，故而不易学、不易用、难以实现，所以在它的基础上又发展出了其他的更易用的置标语言。 XHTML 的出现是因为HTML扩充性不好，内容的表现跟不上时代的变化（如无法表示某些化学符号等），以及因为性能的问题，官方逐渐趋于严格的模式，所以使用 XML 的严格规则的 XHTML 成了 W3C 计划中 HTML 的替代者。 HTML 是人们抽取了 SGML 的一个微小子集而提取出来的。其早期规范比较松散，但比较易学。 XML 也是 SGML 的一个子集，但使用比较严格的模式。 HTML 经过一系列修订，到现在说的 HTML 一般指 HTML 4.01；而现在的 HTML 5 则是 HTML 的第五个修订版，其主要的目标是将互联网语义化，以便更好地被人类和机器阅读，并同时提供更好地支持各种媒体的嵌入。而HTML5本身并非技术，而是标准。它所使用的技术早已很成熟，国内通常所说的html5实际上是html与css3及JavaScript和api等的一个组合， 大概可以用以下公式说明：HTML5 ≈ HTML + CSS 3 + JavaScript + API. HTML5 新增内容 section article nav aside 表单增强 日期，时间，搜索 表单验证 Placeholder 自动聚焦 header/footer 头尾 section/article 区域 nav 导航 aside 不重要内容 em/strong 强调 i icon 图标 5.HTML 元素分类 按照默认样式分类 块级 block 行内 inline inline-block 按照内容分 Flow 文档流 Metadata head 中元数据 Heading 标题元素 Sectioning 分区元素 Iinteractive 交互元素，连接之类的 Phrasing 强调元素 Embedded 嵌入元素 6. HTML元素嵌套关系 块级元素可以包含行内元素 块级元素不一定能包含块级元素 <p><div></div></p> 行内元素一般不能包含块级元素 7. HTML 元素的默认样式 默认样式的意义 默认样式带来的问题 CSS RESET 8.真题 doctype 的意义 让浏览器以标准模式渲染 让浏览器知道元素的合法性 HTML 属于SGML XHTML 属于XML，是HTML 进行XML 的严格化结果 HTML5 不属于SGML 或XML，比XHTML 宽松 HTML 变化，行的语义化元素，表单增强，新的API (离线，影视评，图形，实时通行，本地存储，舍恩比能力) 分类和嵌套变化 em 和i em 语义化，强调，i纯样式标签，斜体 语义化的意义，开发容易理解，机器容易理解，有助于SEO 哪些元素可以自闭合：表单元素 input ，图片 img ，br hr ,meta link，末尾加 / HTML 和DOM 关系: DOM 由HTML 解析而来，JS 可以维护DOM property 和 attribute 的区别： attribute 是死的，property 活的 form 的作用: 直接提交表单，使用 submit /reset 按钮 便于浏览器保存表单 第三方库可以整体提取 第三方库可以进行表单验证