列表、表格、媒体元素

一、列表

列表:就是信息资源的一种展示形式。

HTML5中的列表有3种:无序列表,有序列表,定义列表。

无序列表:

<ul>
    <li>内容。。。</li>
    <li></li>
    <li></li>
    <li></li>
</ul>

注释:ul里面可以加上type属性,ul标签只能嵌套li标签,但是li标签里面可以嵌套任意标签。默认li前面带有实心黑圆点,li标签独占一行,一般用于导航,侧边栏新闻等。

有序列表:

<ol>
    <li>内容,默认是数字1....</li>
    <li></li>
    <li></li>
    <li></li>
</ol>

注释:默认的li标签前面有顺序,每个li都独占一行,一般用于排序列表,试卷,问卷等。

定义列表:

<dl>
    <dt>列表项</dt>
    <dd>列表项的内容</dd>
    <dd></dd>
    <dd></dd>
</dl>

注释:dl是声明定义列表,dt是声明列表项,dd是项的内容。dt,dd都是独占一行。

二、表格

表格特点:简单通用,结构稳定。

基本语法组成:单元格,行,列。

语法:

<table border="1">
        <tr>    <!--tr代表行数,th是单元格标题,字体加粗显示-->
            <th>总页面流量</th>
            <th>共计来访</th>
            <th>会员</th>
            <th>游客</th>
        </tr>
        <tr>
            <td>123478</td>
            <td>839544</td>
            <td>739594</td>
            <td>403835</td>
        </tr>
        <tr>
            <td>123478</td>
            <td>839544</td>
            <td>739594</td>
            <td>403835</td>
        </tr>
        <tr>
            <td>123478</td>
            <td>839544</td>
            <td>739594</td>
            <td>403835</td>
        </tr>
      <tr>
          <td>平均每人浏览</td>
          <td colspan="3" align="center">1.0</td>
      </tr>
    </table>

注释:table是声明表格标签,border是边框属性,tr是行标签,th是单元格标题,td是单元格

表格的跨行、跨列:

<td colsapn ="所跨的列数">跨几列,数字就写几</td>


<td rowspan ="所跨的行数">跨几行,数字就是几</td>

三、媒体元素

<video controls>
        <source src="video/video.mp4"  type="video/video"/>
        <source src="video/video.webm" type="video/video"/>
        你的浏览器不支持video视屏播放
</video>

注释:src是视屏路径,controls是控制播放属性

<audio controls>
    <source src="music/music.mp3"/>
    <source src="music/music.ogg"/>
    你的浏览器不支持播放音频
</audio>

猜你喜欢

转载自blog.csdn.net/JAVA52Lin/article/details/84587607
今日推荐