09月13, 2018

初学HTML三点错误纠正

本文针对初学HTML在进行标签嵌套的时候最容易犯的三点错误进行纠正。

  1. <li>标签的父元素应该是<ol>或者<ul>,而不是直接放置于<div>或者其他标签中。

     <!-- 标准 -->
     <ul>
         <li></li>
         <li></li>
         <li></li>
     </ul>
     <ol>
         <li></li>
         <li></li>
         <li></li>
     </ol>
    
     <!-- 错误代码 -->
     <div>
         <li></li>
         <li></li>
         <li></li>
     </div>
    
  2. <p>标签是段落标签,之中不能嵌套<p>标签,以及其他类似于<div><ul><ol>的块级标签中,否则会造成一些不可避免的bug。

     <!-- 错误代码 -->
     <p>
         一个段落
         <p>第二个段落</p>
     </p>
     <p><div></div></p>
     <p><ul><li>列表</li></ul></p>
    

    以上错误代码经过浏览器解析,最终会变成:

    alt

  3. <a>标签代表着一个链接,所以一个链接中不能嵌套另一个<a>标签,否则会产生奇怪bug

    <!-- 错误代码 -->
     <a href="#">
         链接一
         <a href="#">嵌套的链接</a>
     </a>
    

    以上错误代码经过浏览器解析,最终会变成:

    alt

本文链接:http://www.mobai.pro/post/chuxuehtml.html

-- EOF --

Comments