3.HTML语义标签

1. HTML只在乎标签嵌套关系，和换行/tab等无关
2. HTML中所有文字之间如果有空格/tab/换行都被折叠为一个空格在浏览器展示出来
3. HTML将标签分为容器标签和文本标签，容器标签可以放置任何东西，文本标签只能放置图片/文字/表单元素，其他一律不能放。

容器标签有div/h/ul/ol/li/dt等。
文本标签有p/span/strong/em等

1. 段落标签p （文本标签）

   如果在p标签里插入h1，浏览器会在h1前自动添加</p>进行封闭。在原</p>前自动添加<p>

2. 图片标签img（jpg/gif/png/bmp四种）自封闭标签

   <img src="" alt="厦门赛事" /> alt中的内容表示当图片无法显示时显示的内容

3. 超链接a(anchor)

   <a href="../images/1.jpg" title="厦门一日游" target="_blank">景点</a> title中内容当鼠标悬停于超链接时显示 _blank表示在新页面打开
   
   页面内锚点,相应锚点加name属性或id，超链接用#加name值或id值。点击后页面卷动将相应锚点在最上方显示
   <a href="#myexp">去我的经历</a>
   <p><a name="myexp" id="myexp">我的过往等等等……</a></p>
   
   跨页面锚点 //如果另一个页面没有相应锚点则去顶端
   <a href="cv.html#myexp>查看小明过往</a>

4. 列表（容器标签）

   无序列表
    <ul>
     <li>吃</li>
     <li>穿</li>
     <li>住</li>
    </ul>
   有序列表
    <ol>
     <li>苹果</li>
     <li>香蕉</li>
     <li>橘子</li>
    </ol>
   定义列表//可一个dl对应一个dt
    <dl>//dt不可省略，dd多样。
     <dt>北京</dt> //dt定义标题
     <dd>中国政治中心</dd> //dd对dt进行相应解释
     <dt>上海</dt>
     <dd>中国金融中心</dd>
     <dd>中国教育中心</dd>
     <dt>广州</dt>
     <dd>
      <a href="">衣</a>
      <a href="">食</a>
      <a href="">住</a>
     </dd>
    </dl>

5. 盒子div和span（div的语义是division分割。span的语义是范围/跨度。）

   通过css对div和span进行修饰
   div是容器标签,本身不改变任何内容
      <div class="header"></div>
      <div class="content"></div>
      <div class="footer"></div>
   span是文本标签，只能放置文字/图片/表单
      <p>
       《主席的奋斗》
        <span><a href="">详细信息</a></span>
        <span><a href="">购买</a></span>
      </p>

6. 表单

   <form action="ji.php" method="get">
   		颜色 <input type="color" name="color" /><br />
   		生日 <input type="date" name="date" /><br />
   		<label for="username">姓名</label> <input type="text" name="username" id="username" /><br />
   		密码 <input type="password" name="password" /><br />
   		性别 
   		    <input type="radio" name="gender" checked="checked" id="male"/><label for="male">男</label>
   		    <input type="radio" name="gender" id="female" /><label for="female">女</label><br />
   		爱好 
   			<input type="checkbox" name="aihao" value="1">足球
   			<input type="checkbox" name="aihao" value="2">篮球
   			<input type="checkbox" name="aihao" value="3">棒球<br />
                   籍贯
           	<select name="" id="">
           		<option value="1">湖南</option>
           		<option value="2">湖北</option>
           		<option value="3">安徽</option>
           	</select><br />
                   感想
           	<textarea name="" id="" cols="30" rows="10">多行文本框/文本域</textarea><br />
   			<input type="button" value="普通按钮" />
   			<input type="submit" name="submit" />
   			<input type="reset" name="reset" />
   	</form>

7. 字符实体

   输出<h1>用 <h1$gt;
   < < less than
   > $gt; great than
   版权符号 &copy;
   空格符号  
   

8. 废弃标签

   <font size="3">jier</font>
   
   <b><u><i><em><strong><del>
   
   <br />不换段落另起一行