div中宽高度自适应文字换行居中问题解决
<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
原文出自：https://www.iteye.com/blog/fp-moon-1150774
div中宽高度自适应文字换行居中问题解决的更多相关文章
- css实现div中图片高度自适应并与父级div宽度一致
需求:1.父级div不设置高度 2.图片高度自适应,并且显示为正方形: 以前遇到列表中图片高度必须和父级宽度相同,并且需要为正方形的时候,最开始的方法是定死图片高度,这样会导致不同分辨率下图片会压缩, ...
- div中iframe高度自适应问题
网页分为上.中.下三部分,上.下高度固定中间高度自适应:中间分为左.右两部分,左边宽度固定,右边宽度自适应.现在右侧div是宽度和高度都是自适应,右侧div里有个IFrame,想让IFrame自适应外 ...
- JQuery iframe宽高度自适应浏览器窗口大小的解决方法
iframe宽高度自适应浏览器窗口大小的解决方法 by:授客 QQ:1033553122 1. 测试环境 JQuery-3.2.1.min.js 下载地址: https://gitee.com ...
- winform中dataGridView高度自适应填充完数据的高度
// winform中dataGridView高度自适应填充完数据的高度,就是dataGridView自身不产生滚动条,自己的高度是根据数据的多少而变动. 在load的时候,数据绑定后,加上如下代码: ...
- js控制div滚动条，滚动滚动条使div中的元素可见并居中
1.html代码如下 <div id="panel"> <div id="div1"></div> <div id=& ...
- WPF中RichTextBox高度自适应问题解决方法
最近做一个项目需要用到RichTextBox来显示字符串,但是不允许出现滚动条,在RichTextBox宽度给定的条件下,RichTextBox的高度必须正好显示内容,而不出现下拉滚动条. 这样就要计 ...
- 一个position为fixed的div，宽高自适应，怎样让它水平垂直都在窗口居中？
.div{ position: fixed; left: %; top: %; -webkit-transform: translate(-%, -%); transform: translate(- ...
- div中img依据不同分辨率居中显示，超出部分隐藏
在做banner居中时 碰到的问题,知道可以用背景图实现居中显示,但是内心是想深究下的,故找到几种办法收集一下,后面两种真的是奇技淫巧 来着下面两处 https://www.zhihu.com/que ...
- js获取网页中宽高度集合
document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.docume ...
随机推荐
- python yml 文件处理
安装 pip install pyyaml import yaml import io s = {'host': {'ip00': '10.0.0.1', 'ip01': {'one': '10.0. ...
- FTP的连接方式（防火墙的配置）
FTP是仅基于TCP的服务,不支持UDP.与众不同的是FTP使用2个端口,一个数据端口和一个命令端口(也可叫做控制端口).通常来说这两个端口是21(命令端口)和20(数据端口). ...
- MacBook通过SSH远程访问Parallel中的Ubuntu简明教程
作为一个前端,后端也需要了解,最终选择PHP入手学习,本来想选择Python,思前想后还是PHP作为Web开发比较合适,环境最终选择Ubuntu开发,由于是第一次,遇到不少坑,经过不懈的努力不断Goo ...
- 文本段落缩进text-indent:2em
中文文字中的段前习惯空两个文字的空白,这个特殊的样式可以用下面代码来实现: p{text-indent:2em;} <p>1922年的春天,一个想要成名名叫尼克卡拉威(托比?马奎尔Tobe ...
- android button的selector
实现按钮的selector <?xml version="1.0" encoding="utf-8"?> <selector xmlns:an ...
- A——奇怪的玩意（POJ1862）
题目: 我们的化学生物学家发明了一种新的叫stripies非常神奇的生命.该stripies是透明的无定形变形虫似的生物,生活在果冻状的营养培养基平板菌落.大部分的时间stripies在移动.当他 ...
- this关键字和static关键字
this关键字 普通方法中,this总是指向调用该方法的对象. 构造方法中,this总是指向正要初始化的对象. this区分成员变量和全局变量的作用,在当前类中可以省略. this的常用方法: 让类中 ...
- ExecutionContext(执行上下文)综述
>>返回<C# 并发编程> 1. 简介 2. 同步异步对比 3. 上下文的捕获和恢复 4. Flowing ExecutionContext vs Using Synchron ...
- Vue.js 从源码理解v-for和v-if的优先级的高低
在vue.js里面,v-for和v-if是可以一起使用作用在某个元素上,网上看到一篇文章说永远不要把v-for和v-if同时用在同一个元素上,感觉有点瞎扯,官网也注明了可以一起使用的,还把两个指令的优 ...
- linux安装python3环境并配置虚拟环境
1.安装必要库 yum -y install gcc yum -y install zlib-devel bzip2-devel openssl-devel ncurses-devel sqlite- ...