多列等高：使用table属性实现

系统管理员 2024-04-17 05:50 60阅读 0赞

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>Document</title>
        <style>
            .wrapper{
                display: table;
                border-spacing: 10px;
            }
            .wrapper >div{
                /* 不设高度 */
                display: table-cell;
                width: 200px;
                border-radius: 4px;
                background: red;
                border: 1px solid #000;
                padding:10px;
            }
        </style>
    </head>
    <body>
        <div class="wrapper">
            <div>colum1<br>sdf1<br>sdf1<br>sdfn 1<br>ssdf1<br>sdf1<br>sdfn 1<br>ssdf1<br>sdf1<br>sdfn 1<br>s df</div>
            <div>colum1<br>sdf1<br>sdfn 2</div>
            <div>col1<br>s1<br>sdfdf1<br>sdfumn 3</div>
            <div>colum1<br>sdfn 4</div>
        </div>
    </body>
    </html>

发表评论取消回复

表情：

评论列表（有 0 条评论，60人围观）

还没有评论，来说两句吧...

相关阅读

相关多列等高：使用table属性实现

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> ...

系统管理员/ 2024年04月17日 05:50/ 0 赞/ 61 阅读

相关多列布局属性

多列布局多列布局类似报纸或杂志中的排版方式，主要用以控制大篇幅文本。 1、column-count : 分隔列数说明：属性规定元素应该被分隔的列

Dear 丶/ 2023年07月13日 12:17/ 0 赞/ 10 阅读

相关 layui table 数据表格固定列的行高和table其他列的行高不一致

![在这里插入图片描述][bedfeaf4ef818cfeb0b6dcc3ba901feb.png_pic_center] 1、问题描述：使用layui的table数据表格，

小鱼儿/ 2023年01月12日 01:55/ 0 赞/ 613 阅读

相关 el-table实现选择列显示

想法：可以通过一个checkbox控制一列的显示与隐藏选择列按钮 <el-dropdown trigger="click" style="margin-left:

我不是女神ヾ/ 2022年11月16日 13:40/ 0 赞/ 238 阅读

相关 sqlite alter table添加多列

最近在做Android数据库数据维护，新版本要在原有的表的基础上新增三个列。查询标准SQL语法，最初的执行语句如下： <table style="background

清疚/ 2022年08月04日 05:11/ 0 赞/ 294 阅读

相关利用css实现两列等高的方法

1:利用负边距 <style type="text/css"> .container\{ width:980px background:

绝地灬酷狼/ 2022年07月28日 04:13/ 0 赞/ 167 阅读

相关 css实现多列高度不同的div等高

利用padding-bottom|margin-bottom正负值相抵；设置父容器设置超出隐藏（overflow:hidden），这样子父容器的高度就还是它里面的列没有设定pa

浅浅的花香味﹌/ 2022年05月26日 11:09/ 0 赞/ 227 阅读

相关 table表格列随鼠标高亮显示

前言在表格开发中，有时因为表格列数较多，需要表格的列随着鼠标的移动高亮显示，方便查看，如下图（配合行高亮显示）![在这里插入图片描述][watermark_type_Z

怼烎@/ 2022年04月17日 07:15/ 0 赞/ 494 阅读

相关多种方法实现div两列等高（收集整理）

HTML骨架 <div id="header">头部</div> <div id ="container"> <div class="mai

深碍√TFBOYSˉ_/ 2021年12月22日 09:15/ 0 赞/ 332 阅读

相关 css 多列等高等宽布局

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzMz

Bertha 。/ 2021年11月17日 22:52/ 0 赞/ 402 阅读