<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>div模拟table，可实现左右高度同增长</title>
<style type="text/css">
body{
    background: #ccc;
}
.box{
    width: 800px;
    background: #999;
    margin: 0 auto;
}
.div-tabel{
    display: table;
    width: 800px;
    border-spacing:20px;/*边距*/
}
.div-tabel-row{
    display: table-row;
}
.div-table-cell{
    display: table-cell;
    background: #fff;
    width: 50%;
    padding: 20px;
}
</style>

</head>
<body>
    <div class="box">
        <div class="div-tabel">
            <div class="div-tabel-row">
                <div class="div-table-cell">
                    <p>div模拟table，可实现左右高度同增长div模拟table，可实现左右高度同增长</p>
                </div>
                <div class="div-table-cell">
                    <p>div模拟table，可实现左右高度同增长div模拟table，可实现左右高度同增长div模拟table，可实现左右高度同增长div模拟table，可实现左右高度同增长div模拟table，可实现左右高度同增长div模拟table，可实现左右高度同增长</p>
                </div>
            </div>
        </div>
    </div>

</body>
</html>

效果：

div模拟table，可实现左右高度同增长（html布局）的更多相关文章

  1. div模拟table

    <!DOCTYPE html><html><head><meta charset="UTF-8"><title>div模 ...

  2. 使用contenteditable+div模拟textarea文本域实现高度自适应

    使用contenteditable+div模拟textarea文本域实现高度自适应 开发过程中由于需要在发送消息的时候需要有一个可以高度自适应的文本域,一开始是使用textarea并搭配auto-si ...

  3. 通过div模拟table

    参考: https://css-tricks.com/complete-guide-table-element/ 不要使用内联样式,但只是为了了解这里是如何去: <section style=& ...

  4. div模拟textarea文本域轻松实现高度自适应——张鑫旭

    by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=1362 一.关于tex ...

  5. div模拟textarea实现高度自增长

    今天突然有位前端的朋友问我textarea怎么实现高度随内容自增长,我一下子懵了,首先想到的是用js改变textarea的高度,但是百度了很多参考代码效果都不是很理想. 因为之前实际项目中用的text ...

  6. div模拟textarea以实现高度自适应实例页面

    作为多行文本域功能来讲,textarea满足了我们大部分的需求.然而,textarea有一个不足就是不能像普通div标签一样高度可以跟随内容自适应.textarea总是很自信地显摆它的滚动条,高度固执 ...

  7. div模拟textarea文本域轻松实现高度自适应

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. H5新增属性contenteditable（不用JS，实现div模拟textarea高度自增长）

    无意中看到一篇博客介绍了contenteditable这个属性——不需用JS,只需在div里加上contenteditable="true",即可实现div模拟textrarea( ...

  9. div模拟textarea自适应高度

    之前在公司做项目的时候,有这么一个需求,要我写一个评论框,可以随着评论的行数增加而自动扩大,最开始我想用textarea实现,但是后来尝试后发现textarea并不适合,textarea的高度不会随着 ...

随机推荐

  1. java中的队列

    转载自:http://blog.csdn.net/guijava/article/details/3784658 在java5中新增加了java.util.Queue接口,用以支持队列的常见操作.Qu ...

  2. 数据结构 B-树和B+树的应用：数据搜索和数据库索引

    B-树 1 .B-树定义 B-树是一种平衡的多路查找树,它在文件系统中很有用. 定义:一棵m 阶的B-树,或者为空树,或为满足下列特性的m 叉树:⑴树中每个结点至多有m 棵子树:⑵若根结点不是叶子结点 ...

  3. Node.js怎么处理数据库中日期类型

    问题描述:在数据库里存储时间的时候明明显示的是类如2016-12-22的形式,读取出来后却变成了大概是这样的:Fri May 17 2016 14:12:33 GMT+0800 (中国标准时间) 处理 ...

  4. 面对对象之@classmethod、@staticmethod用法

    @classmethod用法(修饰的函数,第一个参数cls默认是类名,调用方法:实例对象或类对象.方法) class C_mthod(object): name = "f**k" ...

  5. Duiib 创建不规则窗口(转载)

    方法一: 转载:http://blog.csdn.net/chenlycly/article/details/46447297 转载:http://blog.csdn.net/harvic880925 ...

  6. 复旦大学2015--2016学年第一学期（15级）高等代数I期末考试第八大题解答

    八.(本题10分)  设 $V$ 为数域 $K$ 上的 $n$ 维线性空间, $\varphi$ 为 $V$ 上的线性变换. 子空间 $C(\varphi,\alpha)=L(\alpha,\varp ...

  7. alert效果

    <!DOCTYPE html> <head> <meta charset="utf-8" /> <title>拉伸效果</ti ...

  8. iOS10 拍照崩溃问题

    根据相对应得功能添加相关权限即可,没必要全部添加,后面的描述可以官方点,因为会以弹出框的形式访问的,比如相机权限后面的描述可以为:这个应用需要访问相机:后续如果发现其他iOS10上面的问题会及时更新的

  9. Javascript 知识点整理

    1.十进制和十六进制相互转换 /* 十六进制转十进制 */ var test = FF; var x = parseInt(test ,16); //方法一 x = parseInt('0x'+tes ...

  10. 流媒体测试笔记记录之————解决问题video.js 播放m3u8格式的文件,根据官方的文档添加videojs-contrib-hls也不行的原因解决了

    详细代码Github:https://github.com/Tinywan/PHPSharedLibrary/tree/master/Tpl/Html5/VideoJS 想播放hls协议的就是m3u8 ...