Html 相关知识

Html 相关知识

DOM

文档对象模型 (DOM) 是 HTML 和 XML 文档的编程接口。它提供了对文档的结构化的表述，并定义了一种方式可以使从程序中对该结构进行访问，从而改变文档的结构，样式和内容。DOM 将文档解析为一个由节点和对象（包含属性和方法的对象）组成的结构集合。简言之，它会将 web 页面和脚本或程序语言连接起来。

Shadow DOM

Shadow DOM 是浏览器的一种功能，能够自动添加子元素，例如 audio 元素（如下代码所示）在网页中能使用进度条、音量控制等功能，这些相关元素都由浏览器自动生成。

crossorigin 属性

在跨域资源的 script 标签中添加 crossorigin 属性

<script src="user.com/index.js" crossorigin ></script>

这样就可以获取到 user.com/index.js 中的具体错误信息了。
在 HTML5 中，一些 HTML 元素提供了对 CORS 的支持， 例如 <audio>、<img>、<link>、<script> 和 <video> 均有一个跨域属性 (crossOrigin property)，它允许你配置元素获取数据的 CORS 请求。

语义化

对于 HTML 语义化，我们需要注意以下两点：
（1）我们应该果断舍弃那些仅仅为了定义样式而存在的 HTML 标签。如果仅仅是为了改变样式，我们应该使用 CSS 来实现，不要使用 HTML 标签。
（2）在不同的页面部分，我们优先使用正确的语义化标签。如果没有语义标签可用，才去考虑 div 和 span 等无语义标签
许多网站包含了指示导航、页眉以及页脚的 HTML 代码，例如这些：<div id="nav"> <div class="header"> <div id="footer">。
HTML5 提供了定义页面不同部分的新语义元素：

<article>
<aside>
<details>
<figcaption>
<figure>
<footer>
<header>
<main>
<mark>
<nav>
<section>
<summary>
<time>

空元素

一个空元素（empty element）可能是 HTML，SVG，或者 MathML 里的一个不能存在子节点（例如内嵌的元素或者元素内的文本）的 element。
HTML，SVG 和 MathML 的规范都详细定义了每个元素能包含的具体内容（define very precisely what each element can contain）。许多组合是没有任何语义含义的，比如一个 <audio> 元素嵌套在一个

---

元素里。
在 HTML 中有以下这些空元素：

<area>
<base>
<br>
<col>
<colgroup> when the span is present
<command>
<embed>
<hr>
<img>
<input>
<keygen>
<link>
<meta>
<param>
<source>
<track>
<wbr>

可替换元素（置换元素）

在 CSS 中，可替换元素（replaced element）的展现效果不是由 CSS 来控制的。这些元素是一种外部对象，它们外观的渲染，是独立于 CSS 的。
简单来说，它们的内容不受当前文档的样式的影响。CSS 可以影响可替换元素的位置，但不会影响到可替换元素自身的内容。某些可替换元素，例如 <iframe> 元素，可能具有自己的样式表，但它们不会继承父文档的样式。
典型的可替换元素有：

<iframe>
<video>
<embed>
<img>
有些元素仅在特定情况下被作为可替换元素处理，例如：
<option>
<audio>
<canvas>
<object>
<applet>

字符编码

目前 HTML 文档中的内容所用的字符编码都推荐使用 UTF-8，UTF-8 是一种可变长度的 Unicode 编码格式，使用 1 ～ 4 个字节为每个字符编码，其具体的编码规则如下所列

盒子模型

2）图片元素的垂直对齐方式：
对于 inline 元素和 table-cell 元素，标准模式下 vertical-align 属性默认取值为 baseline，在怪异模式下，table 单元 格中的图片的 vertical-align 属性默认取值为 bottom，因此在图片底部会有几像素的空间。

（3）<table>元素中的字体：

CSS 中，对于 font 的属性都是可以继承的，怪异模式下，对于 table 元素，字体的某些元素将不会从 body 等其 他封装元素中继承得到，特别是 font-size 属性。

（4）内联元素的尺寸：

标准模式下，non-replaced inline 元素无法自定义大小，怪异模式下，定义这些元素的 width，height 属性可 以影响这些元素显示的尺寸。

（5）元素的百分比高度：

a：CSS 中对于元素的百分比高度规定如下：百分比为元素包含块的高度，不可为负值，如果包含块的高度没 有显示给出，该值等同于 auto，所以百分比的高度必须在父元素有高度声明的情况下使用。

b：当一个元素使用百分比高度时，标准模式下，高度取决于内容变化，怪异模式下，百分比高度被正确应 用。

（6）元素溢出的处理：

标准模式下，overflow 取默认值 visible，在怪异模式下，该溢出会被当做扩展 box 来对待，即元素的大小由其 内容决定，溢出不会裁减，元素框自动调整，包含溢出内容。

（7）颜色值必须用十六进制标记法。