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 ...
随机推荐
- Nexus 安装
Windows下安装Nexus OSS 3.12.1 1. Nexus 下载 到sonatype官网下载开源免费的OSS版本.OSS即为Open Source Software. 下载地址:https ...
- springboot 基于Tomcate的自启动流程
Springboot 内置了Tomcat的容器,我们今天来说一下Springboot的自启动流程. 一.Spring通过注解导入Bean大体可分为四种方式,我们主要来说以下Import的两种实现方法: ...
- CSS选择器有哪些?选择器的优先级如何排序?
CSS选择器分类: CSS的选择器分类可以分为三大类:id选择器,类选择器,标签选择器. 用法如下: 选择器 e.g. 说明 id选择器 #id #header 选择id="header ...
- Git push时不需要总输入密码
遇到问题: 最近因为换了自己的邮箱密码后,每次push的时候都需要填写密码,账号.很烦 解决方法: [戎马半生的答案] (http://www.cnblogs.com/zhaoyu1995/p/650 ...
- Centos7 安装Python3.7
如果电脑自带的python2.7 先卸载 1.强制删除已安装python及其关联 rpm -qa|grep python|xargs rpm -ev --allmatches --nodeps 2.删 ...
- centos tomcat解压版安装
解压: tar -xzvf apache-tomcat-8.5.23.tar.gz -C /usr/local/java 配置Tomcat的环境变量: export CATALINA_HOME=/us ...
- 广度优先搜索BFS---求出矩阵中“块”的个数
题目: 给出一个 m x n 的矩阵,矩阵中的元素为0或1.如果矩阵中有若干个 1是相邻的,那么称这些1构成了一个“块”.求给定的矩阵中“块”的个数. 0 1 1 1 0 0 1 0 0 1 0 0 ...
- EasyUI笔记(五)表单
本系列只列出一些常用的属性.事件或方法,具体完整知识请查看API文档 Form(表单) 创建一个简单的HTML表单.构建一个包含id.action和method值的表单元素. <form id= ...
- equals和==的使用
1.equals的使用: 引用数据类型的比较:通常情况下比较的是引用数据类型下的栈中的地址,但当你重写了equals方法后就不一定了 User user1=new User("tom&quo ...
- Fight Against Monsters Gym - 102222H【贪心】
贪心的策略 #include <bits/stdc++.h> using namespace std; ; typedef long long ll; struct m { int hp, ...