• 技术文章 >web前端 >html教程

    html怎么做表格

    藏色散人藏色散人2022-01-12 15:32:16原创52106

    html做表格的方法:首先新建一个html,并在“”中间填入表格内容;然后在“”中间输入样式表的样式;最后设置单元格的宽度高度等等样式即可。

    大前端零基础入门到就业:进入学习

    本文操作环境:Windows7系统、HTML5&&CSS3版,DELL G3电脑

    html做个表格的步骤如下:

    1、首先新建一个html,点击<body></body>中间,先填入表格内容;

    9ee54eb505fa75c5c9c052ae6893d5d.png

    2、内容根据需求来写即可,示例代码如下:

    <table>
    <p style="text-align:center ">功课表</p>
    <tr>
    <th>语文</th>
    <td>7:00-7:40</td>
    <td>7:50-8:30</td>
    </tr>
    <tr>
    <th>数学</th>
    <td>7:00-7:40</td>
    <td>7:50-8:30</td>
    </tr>
    <tr>
    <th>英文</th>
    <td>7:00-7:40</td>
    <td>7:50-8:30</td>
    </tr>
    </table>

    461dd38a3a3a5c3d3fe633ab28282d2.png

    3、然后在<head></head>中间输入样式表的样式;

    9eebcb44b5213912c83570b1cf48a9a.png

    4、样式也根据个人的需求来设置即可,设置单元格的宽度高度,合并单元格,位置,颜色等等,示例代码如下:

    <style type="text/css">
    body
    {
    width:340px;
    height :800px;
    }
    table
    {
    border-collapse :collapse ;
    }
    th,td
    {
    width:100px;
    height:40px;
    border :1px solid black;
    font-size:12px;
    text-align :center;
    }     
    </style>

    6db0b8ec0d447a02cb346394b5d1994.png

    5、这里需要注意这个代码“table”的意义是将表格边框合并为单一的边框,将相邻变合并。

    4f933903d5109d53dc603b350a509b8.png

    6、预览结果如下所示,一个简单的表格就制作出来了。

    162fa3ec07b578d9c866547dc03dfab.png

    推荐学习:《HTML视频教程》《css视频教程

    以上就是html怎么做表格的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。

    前端(VUE)零基础到就业课程:点击学习

    清晰的学习路线+老师随时辅导答疑

    自己动手写 PHP MVC 框架:点击学习

    快速了解MVC架构、了解框架底层运行原理

    专题推荐:html
    上一篇:深入解析html中列表的几种方式 下一篇:自己动手写 PHP MVC 框架(40节精讲/巨细/新人进阶必看)

    相关文章推荐

    • ❤️‍🔥共22门课程,总价3725元,会员免费学• ❤️‍🔥接口自动化测试不想写代码?• shtml与html的区别是什么• html编辑软件有哪些• html行内元素有哪些• 如何判断html中文本框内容是否为空• 深入解析html中列表的几种方式
    1/1

    PHP中文网

    ”中间输入样式表的样式;最后设置单元格的宽度高度等等样式即可。","pubDate": "2021-03-31T10:51:53","upDate": "2022-01-12T15:32:16","data": {"WebPage": {"headline": "html怎么做表格","wapUrl": "//m.m.sbmmt.com/article/473196.html","pcUrl": "//m.sbmmt.com/m/div-tutorial-473196.html","fromSrc": "php中文网","domain": "电子科技","category": ["问答"],"isDeleted": 0},"Question": [{"acceptedAnswer":"html做表格的方法:首先新建一个html,并在“”中间填入表格内容;然后在“
    ”中间输入样式表的样式;最后设置单元格的宽度高度等等样式即可。"}],"ImageObject": [{"contentUrl": "//m.sbmmt.com/img/upload/article/202103/31/2021033110473726430.jpg","scale": "5:2"}],"Author": [{"name": "php中文网","jobTitle": ["php公益学习平台"],"headPortrait": "https://img.php.cn/upload/article/000/000/003/5d1b23156bf94358.png"}]}}