在HTML中打開和關閉標簽

Question

我只是HTML的初學者。 因此，很抱歉，這是一個非常基本的問題。

到目前為止，我知道對於每個標簽，我們都應該打開並確保將其關閉，例如：

<span id="xxx" class="yyy">Hello</span>

今天我看到這樣的東西：

<span id="xxx" class="yyy">X</a> 

有人可以解釋一下嗎

Answer 1

 <span id="xxx" class="yyy">X</a> 

這是一個錯誤，瀏覽器將嘗試從中恢復，以確保用戶不會遭受破壞。

一些元素具有可選的開始標簽。 一些元素具有可選的結束標簽。 span和a不在那些元素之中。

Answer 2

根據HTML語法規則，標記<span id="xxx" class="yyy">X</a>在任何情況下都是無效的：即使在此之前有一個<a>開頭的標簽，也沒有匹配的結束標簽，所以到目前為止， a元素無法以這種方式關閉，因為其中將包含一個打開的span元素，並且span不允許省略end標簽。

實際發生的情況取決於上下文。 如果有<a>開始標簽，則結束標簽</a>將關閉它，並且作為錯誤恢復，瀏覽器也將隱式關閉span標簽。

如果沒有<a>開始標簽，則結束標簽</a>將被跳過，因為沒有匹配任何內容，瀏覽器將繼續尋找</span>標簽，直到遇到外部元素的結束標簽為止或不能包含在span元素中的元素（例如<p>的開始標記。

一個簡單的演示：

<style>span { background: green }</style>
<a><span id="xxx" class="yyy">X</a> Hello world
<hr>
<span id="xxx" class="yyy">Y</a> Hi again
<p>Done.

在這里，“ X”將具有綠色背景，因為它是第一個span的唯一內容。 “ Y Hi again”還有綠色背景，因為它將被解析為第二個span的內容。

因此它變得骯臟和凌亂。 而且盡管錯誤恢復在各個瀏覽器中相當一致，並且已在HTML5中進行了標准化，但最好使用有效的標記來避免這種情況。 您可以使用諸如http://validator.w3.org之類的驗證器來檢查您的標記。