1.div设置flex布局

div{

    display: flex;

    align-items: center;

   }

2.div不要设置height,设置min-height

p标签在div中垂直居中，并且div高度随着p标签文字内容的变化而变化的更多相关文章

  1. 不定宽高的文字在div中垂直居中

    本人在面试的时候被问到:如何使一段不定宽高的文字垂直居中呢? 现在来总结一下: 在body中写入结构 <div id="main">    <div id=&qu ...

  2. 设置span在div中垂直居中

    转自:https://blog.csdn.net/weirenkuan/article/details/51177695 使用display:table-cell,span中内容无论多少,都可以垂直居 ...

  3. 未知行数的文字在div中垂直居中

    今天工作中遇到一个问题,就是未知行数的文字在div中怎么垂直居中,如下面的3个图: 图1 图2 图3 图1是2行文字的效果,图2是不经过css垂直居中处理的效果,图3是经过css垂直居中后的效果,ht ...

  4. 没有高度的div中的子元素高度自动撑开

     直接上代码: 很多时候 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...

  5. 尺寸不固定的图片在div中垂直居中并完全显示

    前几天做一个项目,需要批量上传图片,图片外侧div尺寸固定:由于图片是用户输入的,所以大小存在不确定性,产品需求是无论图片尺寸多大,都要垂直居中完全显示 废话不多说,直接上代码 html <ul ...

  6. 设置文字在div中垂直居中，使用line-height

    (从已经死了一次又一次终于挂掉的百度空间人工抢救出来的,发表日期2014-02-19) line-height 行间距 详细使用方法:http://www.w3school.com.cn/css/pr ...

  7. 小的div在大的div中垂直居中

    方法一: 1.代码: <div style="width:200px;height:200px;border:solid blue;position:relative;"&g ...

  8. CSS-布局【1】-图片在div中垂直居中

    方法一:通过增加100%高度行内块居中对齐 <!DOCTYPE html> <html> <head> <meta name="viewport&q ...

  9. 小div在大div中垂直居中，以及div在页面垂直居中

    <html> <head> <title>淘宝 2faner</title> <style type="text/css"&g ...

随机推荐

  1. 转：JMeter压力测试及并发量计算

    最近的一个项目刚刚开发完,因为不是专业测试人员,所以记录下测试过程以备时间长忘记了. 一.JMeter的安装(Linux)1. 下载JMeter:这个就不细说了,直接去(http://jmeter.a ...

  2. ViewResolver和JSTL

    ---------------------siwuxie095                                 ViewResolver 和 JSTL         1.Spring ...

  3. volley的post请求

    //volley发送post请 2 private void volleypost() { 3 String url = "http://apis.juhe.cn/idcard/index? ...

  4. easyrules

    http://www.easyrules.org/tutorials/hello-world-tutorial.html

  5. python subprocess 小例子

    #服务端import socketimport osimport subprocessphone = socket.socket(socket.AF_INET, socket.SOCK_STREAM) ...

  6. python 数据类型 之 字典

    python 3.6.5字典的特性和定义定义:{'key_1':vlaue_1,'key_2':value_2}1.键与值用冒号 : 分开2.项与项 用 , 分开 特性1.可以存放多个值,可以不唯一, ...

  7. taglib简介

    在 JSP最佳实践的 上一期,您学习了一种基于scriptlet的技术,这种技术被用来将上次修改的时间戳添加到JavaServer Page(JSP)文件中.不幸的是,比起它所提供的短期利益,scri ...

  8. PHP 获取当前所在的类名、方法名等

    PHP获取当前类名.方法名  __CLASS__ 获取当前类名  __FUNCTION__ 当前函数名(confirm)  __METHOD__ 当前方法名 (bankcard::confirm) _ ...

  9. Python 之异常处理机制

    python在程序运行出现错误时时有相应的反应机制 ,我们可以针对不同的错误做出不同的响应 list1 = ['a','b','c'] print(list1[4]) #>>>Ind ...

  10. idea单元测试左侧装订线中的颜色指示器设置

    又是idea,idea确实很智能,由于我下载的idea设置可能初始化了,所以我找不到单元测试率覆盖的具体代码情况,到底哪些代码覆盖,哪些代码未覆盖: