关于6-8作业预约挂号那个开放预约科室的表格可以用div来写吗

总觉得那个表格结构有点复杂，使用表格嵌套感觉让html结构好冗杂。不知道类似的结构使用div来布局规不规范

满城烟花刹那芳华 2018-04-22

源自：实战：挂号平台首页 6-6 作业题

收起

3回答

好帮手慕星星 2018-04-23 09:26:01

测试了你的代码，参考以下修改：

把表格的table-layout属性设置成fixed，也就是不随着内容的宽度变化而变化，然后清除表格的内外边距用cellpadding和cellspacing，自己测试一下。

收起回答

提问者满城烟花刹那芳华 2018-04-22 13:08:14

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        tr{/*
            height: 50px;
            width: 100px;
            background: #888;
            border-top: 1px solid red;*/
        }
        td{
            height: 50px;
            width: 100px;
            background: #888;
            border-top: 1px solid red;

        }
    
    </style>
</head>
<body>
    <div class="my-table">
        <table>
            <tr>
                <td>ere</td>
                <td>er</td>
                <td>erg</td>
                <td>geg</td>
            </tr>
            <tr>
                <td>ere</td>
                <td>er</td>
                <td>erg</td>
                <td>geg</td>
            </tr>
        </table>
    </div>
    
</body>
</html>

比如这串代码，

1、我只给tr设置边框是无效的，不知道为什么？

2，td设置的高度是50px，但实际高度和我设置的高度不一样。比如不加边框，实际高度是50.4px，加了边框，height为49.6，另加1px的边框，实际高度为50.6px。是不是表格哪一个默认属性没有清零？

3.我没有在代码中加tbody标签，但网页中审查元素，有了tbody标签，这是为什么？

4、而且tbody高度比两行tr高度相加还要高，也就是说，两行td的高度就算是50.4px乘以2为100.8px，但tbody的实际高度为105.6px；（我试了一下设置table的cellspacing为0，tbody的高度确实成了100.8px，但是多出来的0.8px是哪儿来的？）

收起回答

提问者满城烟花刹那芳华 2018-04-22 10:47:42

就是这一块区域

收起回答

好帮手慕星星 #1

用div布局也是可以的，但是用table表格布局应该会方便一些。自己用哪种布局方式比较灵活就用哪种，没有限制。

2018-04-22 11:08:58
提问者满城烟花刹那芳华回复好帮手慕星星 #2

感觉div用的多了样式设置熟悉一点，表格嵌套不是很熟，而且，表格嵌套都是得td里面嵌套table，然后table里面又是tr td 的，一层一层的还不如里面都是div直接浮动就好了。还有一个问题就是，我没有设置tbody的时候，在网页中审查元素，还是会有tbody标签出现，而且他比td要高一些，看盒模型，td也没有margin，tbody的自身高度就是比td高，不知道为什么

2018-04-22 11:39:22
好帮手慕星星回复提问者满城烟花刹那芳华 #3

可以把你具体的代码粘贴一下吗，更方便解决问题哦。

2018-04-22 12:20:40