<html>

    <head>

        <meta charset="UTF-8"/>

        <title>div中宽高度自适应文字换行居中demo</title>

    </head>

    <style type="text/css">

        .fatherbox{

            width: 200px;

            height: 300px;

            text-align: center;

            /* start 以下为样式内容，不重要*/

            border: 1px solid red;

            background: green;

            /* end 以上为样式内容，不重要*/

        }

        .childbox1{

            display: inline-block;

            vertical-align: middle;

            /* start 以下为样式内容，不重要*/

            background: blue;

            color: #fff;

            padding: 10px;

            /* end 以上为样式内容，不重要*/

        }

        .childbox2{

            display: inline-block;

            vertical-align: middle;

            height: 100%;

        }

    </style>

    <body>

        <div class="fatherbox">

            <div class="childbox1">

                我是居中内容1<br/>

                我是居中内容1<br/>

                我是居中内容1<br/>

                我是居中内容1

            </div>

            <div class="childbox2"></div>

        </div>

    </body>

</html>

div中宽高度自适应文字换行居中demo实现

我是居中内容1
我是居中内容1
我是居中内容1
我是居中内容1
 

原文出自：https://www.iteye.com/blog/fp-moon-1150774

div中宽高度自适应文字换行居中问题解决的更多相关文章

  1. css实现div中图片高度自适应并与父级div宽度一致

    需求:1.父级div不设置高度 2.图片高度自适应,并且显示为正方形: 以前遇到列表中图片高度必须和父级宽度相同,并且需要为正方形的时候,最开始的方法是定死图片高度,这样会导致不同分辨率下图片会压缩, ...

  2. div中iframe高度自适应问题

    网页分为上.中.下三部分,上.下高度固定中间高度自适应:中间分为左.右两部分,左边宽度固定,右边宽度自适应.现在右侧div是宽度和高度都是自适应,右侧div里有个IFrame,想让IFrame自适应外 ...

  3. JQuery iframe宽高度自适应浏览器窗口大小的解决方法

    iframe宽高度自适应浏览器窗口大小的解决方法   by:授客 QQ:1033553122 1.   测试环境 JQuery-3.2.1.min.js 下载地址: https://gitee.com ...

  4. winform中dataGridView高度自适应填充完数据的高度

    // winform中dataGridView高度自适应填充完数据的高度,就是dataGridView自身不产生滚动条,自己的高度是根据数据的多少而变动. 在load的时候,数据绑定后,加上如下代码: ...

  5. js控制div滚动条，滚动滚动条使div中的元素可见并居中

    1.html代码如下 <div id="panel"> <div id="div1"></div> <div id=& ...

  6. WPF中RichTextBox高度自适应问题解决方法

    最近做一个项目需要用到RichTextBox来显示字符串,但是不允许出现滚动条,在RichTextBox宽度给定的条件下,RichTextBox的高度必须正好显示内容,而不出现下拉滚动条. 这样就要计 ...

  7. 一个position为fixed的div，宽高自适应，怎样让它水平垂直都在窗口居中？

    .div{ position: fixed; left: %; top: %; -webkit-transform: translate(-%, -%); transform: translate(- ...

  8. div中img依据不同分辨率居中显示，超出部分隐藏

    在做banner居中时 碰到的问题,知道可以用背景图实现居中显示,但是内心是想深究下的,故找到几种办法收集一下,后面两种真的是奇技淫巧 来着下面两处 https://www.zhihu.com/que ...

  9. js获取网页中宽高度集合

    document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.docume ...

随机推荐

  1. 持续化运维 DevOps

            DevOps(Development和Operations的组合词)是一组过程.方法与系统的统称,用于促进开发(应用程序/软件工程).技术运营和质量保障(QA)部门之间的沟通.协作与整 ...

  2. Linux的那些事-系统启动（增加开机启动项）

    1   /etc/init.d 2   /etc/inittab 3   /etc/rc.d/init.d  1.   /etc/init.d 是一般开机的启动服务存放在这个目录下,至于实现机制,其实 ...

  3. light oj 1014 - Ifter Party分解因子

    1014 - Ifter Party   I have an Ifter party at the 5th day of Ramadan for the contestants. For this r ...

  4. pocsuite3使用教程

    pocsuite3使用教程 0X00简介 PocSuite3是Knownsec 404安全研究团队设计的一款远程漏洞测试以及PoC开发框架,该框架使用了功能极其强大的概念验证引擎,并自带了大量渗透测试 ...

  5. 正则表达式验证IP地址(绝对正确)

    正则验证合法_有效的IP地址(ipv4/ipv6) 不墨迹直接上代码: 正则表达式: /^((2[0-4]\d|25[0-5]|[01]?\d\d?)\.){3}(2[0-4]\d|25[0-5]|[ ...

  6. [红日安全]Web安全Day1 - SQL注入实战攻防

    本文由红日安全成员: Aixic 编写,如有不当,还望斧正. 大家好,我们是红日安全-Web安全攻防小组.此项目是关于Web安全的系列文章分享,还包含一个HTB靶场供大家练习,我们给这个项目起了一个名 ...

  7. （转）elasticsearch collapse 折叠字段应用

    转自:https://elasticsearch.cn/article/132 在 Elasticsearch 5.x 有一个字段折叠(Field Collapsing,#22337)的功能非常有意思 ...

  8. cf936B

    题意简述:给出一个有向图,问从s出发是否能找到一条长度为奇数的路径并且路径的端点出度为0,存在就输出路径,如果不存在判断图中是否存在环,存在输出Draw,否则输出lose 题解:类似于DP,将每一个点 ...

  9. 论文阅读笔记（二十三）【ECCV2018】：Robust Anchor Embedding for Unsupervised Video Person Re-Identification in the Wild

    Introduction 当前主要的非监督方法都采用相同的训练数据集,这些数据集在不同摄像头中是对称的,即不存在单个行人的错误项,这些方法将在实际场景中效果下降.在本方法中,作者引入了非对称数据,如下 ...

  10. Notes writer Pro

    Notes writer Pro pen钢笔和Pencil铅笔发现没啥区别 笔记软件使用说明书: https://www.lanzous.com/i777i3c