<!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. 如何选择合适的CRM客户关系管理软件？

    面对日益激烈的市场竞争,很多企业管理者不断通过各种途径和方式,试图寻找一个合适并行之有效的解决方案,以帮助他们解决企业管理难题,不断提高企业的业绩,获得持续的成功. 企业管理软件的出现填补了企业管理领 ...

  2. 移动APP项目优化

    团队计划:设计一款给用户提供就医帮助的安卓APP. 项目计划:两个月内团队成员共同开发完成此款APP,此款APP提供预约挂号,名医名院咨询,就医导航等功能. 角色职责:负责交互设计.UI界面设计.1. ...

  3. JS跨域

    //2011-7-25 (function(){ //闭包 function load_script(xyUrl, callback){ var head = document.getElements ...

  4. js_保留关键字

    网页可以被我们分为三个大的部分:结构,表现,形式而js就是专对于表现的,js是一门编程的解释性脚本语言,和其他的语言相同js也有自己的保留的关键字,下面我们来看看js保留的关键字吧!js一共有56个关 ...

  5. 关于工程结合git的配置

    我们通常把代码放到git sever中,(scm manager)中,上传,下载代码, 可是通常工程的代码改动会有图标提示,改动过的,或者新增的,那么需要在eclipse的工程中做一下简单配置 1,工 ...

  6. Radmin Center 1.54 测试版

    软件简介:radmin center 用于集中管理安装了 radmin server 的服务器,支持一键远程管理,数据全部本地存储,关键数据使用RC4变形加密.同时保留了radmin的高安全性和高易用 ...

  7. 【前端】JavaScript获取指定范围内的随机整数

    function getRandomIntNumber(min, max) { var span = max - min + 1; var result = Math.floor(Math.rando ...

  8. 微信，qq，微博如何不用每次清缓存就能看到h5修改过的结果

    描述:每次在对js,和css进行修改,想要在微信,微博或则qq里面预览效果,会发现没有生效,那是因为这些客户端会将静态进行缓存,我们需要清理缓存才能看到修改过的效果,但是每次清理缓存会很麻烦,影响开发 ...

  9. docker tomcat7 dubbo-admin monitor

    docker run --name=dubbo_admin9201 -tid -p : -v /home/dubbo/admin:/usr/local/tomcat7/webapps/ROOT cen ...

  10. js设计模式总结-迭代器模式

    迭代器模式 要解决的问题 迭代器要解决的问题很简单很单纯,就是进行遍历操作. 实现原理 基本所有语言都实现了迭代器,javascript也不例外,如Array.prototype.forEach,fo ...