CSS 在table td一段文字前面做一个空白小框，空白下划线

最新推荐文章于 2024-04-06 00:46:18 发布

qb170217

最新推荐文章于 2024-04-06 00:46:18 发布

阅读量671

点赞数

分类专栏： java

本文链接：https://blog.csdn.net/qb170217/article/details/118945296

版权

java 专栏收录该内容

42 篇文章 0 订阅

订阅专栏

https://www.cnblogs.com/xiaobaizhiqian/p/8338308.html

https://www.zhihu.com/question/395120933

预览

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8"/>
    <title>Title</title>
    <style>
        body{
            width: 21cm;
            height: 27cm;
        }
        table, table td{
            border-collapse: collapse;
            border: 1px solid;
            font-size: 20pt;
            text-align: center;
        }
        .none {
            display: inline-block;
            width: 15px;
            height: 15px;
            border: 1px solid;
            margin-right: 5px;
        }
        .words{
            text-decoration: underline ;
        }
    </style>
</head>
<body>
<table width="100%">
    <tr>
        <td>2332</td>
        <td>333</td>
        <td>111</td>
    </tr>
    <tr>
        <td align="left"><span class="none"></span>2332<span class="words">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span></td>
        <td>333</td>
        <td>111</td>
    </tr>
    <tr>
        <td>2332</td>
        <td>333</td>
        <td>111</td>
    </tr>
</table>

<div id="square"></div>
</body>
</html>