链接元素

<style>
    p {
        margin-top: 500px;
    }
</style>
<body>
    <!-- 锚点跳转 -->
    <a href="#anchor">到底部</a>
    <p id="anchor">到了</p>
    <!-- 指向链接页面的地址 -->
  <a href="https://www.baidu.com/">百度1</a> 
    <!-- 当前页面打开  -->
  <a href="https://www.baidu.com/" target="_self">百度2</a>
    <!-- 新页面打开链接 -->
  <a href="https://www.baidu.com/" target="_blank">百度3</a>
    <!-- 下载文件 -->
    <a href="/0928/php/demo1.html" download="文件">下载</a>
    <!-- 客户电话 -->
    <a href="tel:180111*****">客户电话</a>
    <!-- 发送邮件 -->
    <a href="mailto:147258@qq.com">发送邮件</a>
</body>

表格元素

代码如下:

<style>
    table {
        width: 500px;
        height: 200px;
    }
    thead {
        background-color:darkgray;
    }
    caption {
        font-size: 1.5rem;
        margin-bottom: 10px;
    }
    tbody {
        background-color:gainsboro;
    }
    .name {
        background-color:honeydew;
    }
</style>
<body>
    <!-- 定义表格 -->
    <table border="1" cellspacing="0" cellpadding="8">
        <caption>商品清单</caption>
        <!-- 定义表头 -->
       <thead>
        <tr>
            <th>名字</th>
            <th>单价</th>
            <th>单位</th>
            <th>数量</th>
            <th>金额</th>
        </tr>
       </thead>
       <!-- 定义主体 -->
       <tbody>
        <tr>
            <td>手机1</td>
            <td>2000</td>
            <td>部</td>
            <td>2</td>
            <td>4000</td>
        </tr>
        <tr>
            <td>手机2</td>
            <td>3000</td>
            <td>部</td>
            <td>1</td>
            <td>3000</td>
        </tr>
        <tr>
            <td>手机3</td>
            <td>4000</td>
            <td>部</td>
            <td>2</td>
            <td>8000</td>
        </tr>
        <tr class="name">
            <td rowspan="2">接收人</td>
            <td colspan="2" rowspan="2"></td>
            <td>数量:</td>
            <td>合计:</td>
        </tr>
        <tr class="name">
            <td colspan="2">日期:</td>
        </tr>
        </tbody>
    </table>
</body>

链接元素和表格的基础知识

链接元素

表格元素

代码如下: