HTML-表格与媒体元素

什么是列表?

列表就是信息资源的一种展示形式。它可以使信息结构化和条理化,并以列表的样式显示出来,以便浏览者能更快捷地获得相应的信息。

无序列表

语法:

<ul>    
    <li>.........</li> 
    <li>.........</li> 
    <li>.........</li> 
    <li>.........</li> 
 </ul>

没有顺序,每个<li>标签独占一行(块元素)

默认<li>标签项前面有个实心小圆点

一般用于无序类型的列表,如导航、侧边栏新闻、有规律的图文组合模块等

有序列表

语法:

<ol>
     <li>..........</li>
    <li>..........</li>
    <li>..........</li>
   <li>..........</li>
</ol>

有顺序,每个<li>标签独占一行(块元素)

默认<li>标签项前面有顺序标记

一般用于排序类型的列表,如试卷、问卷选项等

定义列表

<dl>

        <dt>标题</dt>

         <dd>.......<dd>

</dl>

没有顺序,每个<dt>标签、<dd>标签独占一行(块元素)

默认没有标记一般用于一个标题下有一个或多个列表项的情况没有顺序,每个<dt>标签、<dd>标签独占一行(块元素)默认没有标记

表格

语法:

<table>
    <tr>
         <td>第1个单元格的内容</td>
         <td>第2个单元格的内容</td>
        ……
    </tr>
    <tr>
         <td>第1个单元格的内容</td>
         <td>第2个单元格的内容</td>
        ……
    </tr>
</table>

表格的跨列与跨行

<table>
  <tr>
    <td colspan="n">单元格内容</td> (所跨的列数)
  </tr>
  <tr>
    <td rowspan="n">&nbsp;</td>(所跨的行数)
    <td>&nbsp;</td>
  </tr>

HTML5的结构元素

描  述 元素名
标题头部区域的内容(用于页面或页面中的一块区域) header
标记脚部区域的内容(用于整个页面或页面的一块区域) footer
Web页面中的一块独立区域 section
独立的文章内容 article
相关内容或应用(常用于侧边栏) aside
导航类辅助内容 nav

 

<iframe>内联框架

语法:<iframe src="path" name="mainFrame" ></iframe>

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>iframe的使用</title>
    </head>
    <body>
        <a href="http://www.baidu.com" target="mainFram" >点击打开百度</a><br />
        <a href="http://www.bdqn.com" target="mainFram" >点击打开北大青鸟</a><br />
        <a href="index.html" target="mainFram" >点击打开一个HTML页面</a><br />
        
        <iframe name="mainFram" width="500" height="500"></iframe>
        
    </body>
</html>

 

 

 

 

 

 

 

 

 

 

HTML-表格与媒体元素

上一篇:Promox VE安装黑群晖保姆级图文教程


下一篇:【转载】移动端布局概念总结