HTML学习笔记——列表和table

时间：2024-04-30 21:37:32

1>有序列表、无序列表和自定义列表

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

</head>

<body>

    <!-- 有序列表 -->

    <ol type="a">

        <li>有序列表1</li>

        <li>有序列表2</li>

        <li>有序列表3</li>

        <li>有序列表4</li>

        <li>有序列表5</li>

    </ol>

    <!-- 无序列表 -->

    <ul type="circle">

        <li>无序列表1</li>

        <li>无序列表2</li>

        <li>无序列表3</li>

        <li>无序列表4</li>

        <li>无序列表5</li>

    </ul>

    <!-- 自定义列表 -->

    <dl>

        <dt>第一大段</dt>

        <dd>第1小段</dd>

        <dd>第2小段</dd>

        <dd>第3小段</dd>

        <dd>第4小段</dd>

    </dl>

</body>

</html>

2>table

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

</head>

<body>

    <!-- border为边框的粗细 -->

    <!-- tr为行，td为列 -->

    <table border='1' width='600' bordercolor="blue" bgcolor="grey" align="center">

        <caption><font color='blue'>课程表</font></caption>

        <tr width="600" height="50" align='center' valign='top'>

            <td rowspan='3'>abc</td>

            <td colspan='2'>123</td>

            <td>123</td>

            <td>abc</td>

        </tr>

        <tr>

            <td>123</td>

            <td>abc</td>

            <td rowspan='2'>123</td>

            <td>abc</td>

        </tr>

        <tr>

            <td>123</td>

            <td>abc</td>

            <td>abc</td>

        </tr>

    </table>

</body>

</html>

相关文章