zoukankan      html  css  js  c++  java
  • html牛刀小试

    表格图

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <style type="text/css">
                ul {
                    list-style: none;
                }
        </style>
    </head>
    <body>
    <table border="1px" align="center"  style="border-collapse: collapse; border:1px solid blue">
        <tr>
            <td colspan="3" align="center">星期一菜谱</td>
        </tr>
        <tr>
           <td rowspan="2">素菜</td>
            <td>情操茄子</td>
            <td>花椒扁豆</td>
        </tr>
        <tr>
            <td>小葱豆腐</td>
            <td>炒白菜</td>
        </tr>
        <tr>
           <td rowspan="2">荤菜</td>
            <td>油焖大虾</td>
            <td>海参鱼刺</td>
        </tr>
        <tr>
            <td>
                红烧肉
                <img src="rourou.png" alt="">
            </td>
            <td>烤全羊</td>
    
        </tr>
    </table>
    
    <hr>
    
    <table border="1px" align="center" width="500px" style="border-collapse: collapse;border:1px solid blueviolet">
        <caption align="center">课程表</caption>
        <tr align="center">
            <td>项目</td>
            <td colspan="6">上课</td>
            <td>休息</td>
        </tr>
        <tr align="center">
            <td>星期</td>
            <td>星期一</td>
            <td>星期二</td>
            <td>星期三</td>
            <td>星期四</td>
            <td>星期五</td>
            <td>星期六</td>
            <td>星期日</td>
        </tr>
        <tr align="center">
            <td rowspan="4">上午</td>
            <td>语文</td>
            <td>数学</td>
            <td>英语</td>
            <td>英语</td>
            <td>物理</td>
            <td>计算机</td>
            <td rowspan="4">休息</td>
        </tr>
        <tr align="center">
            <td>数学</td>
            <td>语文</td>
            <td>地理</td>
            <td>历史</td>
            <td>化学</td>
            <td>计算机</td>
        </tr>
        <tr align="center">
            <td>化学</td>
            <td>语文</td>
            <td>体育</td>
            <td>计算机</td>
            <td>英语</td>
            <td>计算机</td>
        </tr>
        <tr align="center">
            <td>数学</td>
            <td>语文</td>
            <td>地理</td>
            <td>历史</td>
            <td>化学</td>
            <td>计算机</td>
        </tr>
            <tr align="center">
            <td rowspan="2">上午</td>
            <td>语文</td>
            <td>数学</td>
            <td>英语</td>
            <td>英语</td>
            <td>物理</td>
            <td>计算机</td>
            <td rowspan="2">休息</td>
        </tr>
            <tr align="center">
            <td>化学</td>
            <td>语文</td>
            <td>体育</td>
            <td>计算机</td>
            <td>英语</td>
            <td>计算机</td>
        </tr>
    </table>
    
    </body>
    </html>
    

    图片实例:

  • 相关阅读:
    FreeMarker的<#if></#if>标签
    ubuntu的dpkg命令安装和卸载软件
    ubuntu建立软链接注意事项
    halo的工作目录,有一个是在代码里配置的,硬编码了
    Springboot的多环境配置
    idea中的springboot+gradle项目报错springboot configuration annotation processor not found in classpath
    maven中的pom.xml中的scope的作用
    设置idea的快捷键组合 设置为默认
    springboot无法查询到后台的数据
    ssh互信条件下的多机拷贝脚本和执行远程命令
  • 原文地址:https://www.cnblogs.com/Lance-WJ/p/13674900.html
Copyright © 2011-2022 走看看