<!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. view向上滚动

    之前本来是打算做TextView垂直向上滚动的,后来发现一位大神做得很好,https://github.com/sfsheng0322/MarqueeView 孙福生大神,然后自己要用到多个View向 ...

  2. linux内核的makefile.txt讲解

    linux内核的linux-3.6.5\Documentation\kbuild\makefiles.txt Linux Kernel Makefiles This document describe ...

  3. Dynamics AX 2012 R2 如何处理运行时间较长的报表

    当处理的数据量较多,逻辑比较复杂时,报表可能会超时.为了解决这个问题,Reinhard一直使用SrsReportDataProviderPreProcess来做预处理报表.它会在调用SSRS前,在AX ...

  4. maven的使用--初级篇

    一.前言         早就知道maven 在java 项目的管理方面名声显赫,于是就想着学习掌握之,于是查阅了大量文档.发现这些文档的作者都是java 的大腕,大多都是站在掌握了一定maven 基 ...

  5. 【GO】GO语言学习笔记二

    基本类型: 布尔型:boolean 整型:int8,byte,int16,int,uint,uintptr等 浮点型:float32,float64 复数类型:complex64,complex128 ...

  6. 获取tomcat下路径

    import java.io.File; public class MainTest { public static void main(String[] args) { //获取是项目的绝对路径 S ...

  7. Python 学习随笔1

    在一个列表中,找出重复数组的位置. 比如在列表name = [1, 5, 8, 22, 56, 2, 8, 45, 7, 2, 35, 2, 486, 2, 152, 111, 265, 2, 2]中 ...

  8. LA 5713 秦始皇修路 MST

    题目链接:http://vjudge.net/contest/144221#problem/A 题意: 秦朝有n个城市,需要修建一些道路使得任意两个城市之间都可以连通.道士徐福声称他可以用法术修路,不 ...

  9. oracle 删除用户时的坑

    ORACLE在使用 SELECT SID,SERIAL# FROM V$SESSION WHERE USERNAME='dt_zntg_trade' 删除会话时,一定要注意dt_zntg_trade的 ...

  10. 自适应css 框架 PURE

    Bootstrap 好用 但是太大啦 有时候只需要用到媒体查询这一块的样式 Pure.css可以很好地替代 直接上地址咯: http://purecss.io/ https://unpkg.com/p ...