<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title>实际是将其转为table</title>

        <link rel="stylesheet" href="plugins/bootstrap/css/bootstrap.min.css" />

        <style>

            .div{

                border: 1px solid saddlebrown;

                border-spacing: 15px;

                width: 30%;

                display: table;

            }

            .div1{

                display: table-cell;

                width: 100px;

                height:150px;

                background-color: royalblue;

                vertical-align: middle;

            }

            .div2{

                display: table-cell;

                border: 1px solid seagreen;

                padding:10px;

            }

        </style>

    </head>

    <body>

        <div class="div">

            <div class="div1"></div>

            <div class="div2">

                发舒服舒服舒服舒服水电费

                发舒服舒服舒服舒服水电费

                发舒服舒服舒服舒服水电费

                发舒服舒服舒服舒服水电费

                发舒服舒服舒服舒服水电费

                发舒服舒服舒服舒服水电费

            </div>

        </div>

    </body>

</html>

div等高布局的更多相关文章

  1. 两个同级div等高布局

    显示效果: css代码如下 .wrap{ overflow:hidden; } .left{ width:30%; background:#09C; } .right{ width:70%; back ...

  2. 纯CSS实现三列DIV等高布局

    <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> &l ...

  3. css圣杯布局、等高布局

    所谓圣杯布局,就是自适应浏览器的分辨率,也称双飞翼布局. 例子: <style> body{margin:0;} .center{height:600px;background:#f60; ...

  4. div两栏等高布局

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

  5. 布局两列div等高方法

    一.左右布局,左侧div绝对定位,外div相对定位 <!DOCTYPE html> <html lang="en"> <head> <me ...

  6. 纯css实现div三列等高布局的最简单方法简化版/也可以多列

    使用正padding和负margin对冲实现多列布局方法 这种方法很简单,就是在所有列中使用正的上.下padding和负的上.下margin,并在所有列外面加上一个容器,并设置overflow:hid ...

  7. CSS3中flexbox如何实现水平垂直居中和三列等高布局

    最近这些天都在弥补css以及css3的基础知识,在打开网页的时候,发现了火狐默认首页上有这样一个东西.

  8. CSS等高布局的6种方式

    × 目录 [1]边框模拟 [2]负margin [3]table[4]absolute[5]flex[6]js 前面的话 等高布局是指子元素在父元素中高度相等的布局方式.等高布局的实现包括伪等高和真等 ...

  9. HTML CSS + DIV实现整体布局

    HTML CSS + DIV实现整体布局 1.技术目标: 开发符合W3C标准的Web页面 理解盒子模型 实现DIV+CSS整体布局 2.什么是W3C标准? W3C:World Wide Web Con ...

随机推荐

  1. 【洛谷P3749】[六省联考2017]寿司餐厅（网络流）

    洛谷 题意: 给出\(n\)份寿司,现可以选取任意多次连续区间内的寿司,对于区间\([l,r]\),那么贡献为\(\sum_{i=l}^r \sum_{j=i}^rd_{i,j}\)(对于相同的\(d ...

  2. 登录-退出，在T分钟实现BC次用户登录退出，单次登录-退出%90用户时间t,需要的并发用户（线程）

    聚合报告%90响应时间:%90用户响应时小于该值 2种理解方式: 一. 1s可完成的用户1/t: T分钟完成的用户T *(1/t); BC次用户需要的线程数Thread= BC/(T*(1/t)) = ...

  3. Spring Boot 调度器

    Spring Boot 可以很简单的添加一个调度任务 首先需要添加maven依赖 <dependency> <groupId>org.springframework</g ...

  4. 201871010106-丁宣元 《面向对象程序设计（java)》第六—七周学习总结

    201871010106-丁宣元 <面向对象程序设计(java)>第六—七周学习总结 正文开头 项目 内容 这个作业属于哪个课程 https://www.cnblogs.com/nwnu- ...

  5. python字符串的split replace strip

    split replace strip是字符串中内置的三个函数,作用分别是分割 替换 去空格 0x01:split split(a,b):用指定的字符(a)分割字符串,可以限制分割的次数(b),返回一 ...

  6. hbase配置hdfs的HA之后需要修改的路径

    hbase-site.xml中配置了hdfs的一个路径 <property> <name>hbase.rootdir</name> <value>hdf ...

  7. zz 机器学习系统或者SysML&DL笔记

    机器学习系统或者SysML&DL笔记(一)  Oldpan  2019年5月12日  0条评论  971次阅读  1人点赞 在使用过TVM.TensorRT等优秀的机器学习编译优化系统以及Py ...

  8. 基于OpenVINO的多输入model optimizer(Tensorflow)

    Step I:下载预训练模型 wget -O - https://github.com/mozilla/DeepSpeech/releases/download/v0.3.0/deepspeech-0 ...

  9. [LeetCode] 72. Edit Distance 编辑距离

    Given two words word1 and word2, find the minimum number of operations required to convert word1 to  ...

  10. uniApp上传图片

    项目中用到了上传图片的功能,记录一下.增强记忆. 要上传图片首先就要先选择图片,或者是先拍照,此时先调用的是 chooseImage 接口,此接口可选择拍照也可以从相册中选择. 它有几个参数,具体可以 ...