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. stm32阅读代码工具source insight

    不知道学stm32有没有这样的烦恼,想看一个项目的代码,但是用keil又发现建立工程太麻烦,单个打开文件又找不到函数和变量之间的依赖关系,变量和函数又不能高亮显示,linux下vim和emacs虽然很 ...

  2. 宋体freetype16和12号字无法正常显示

    在使用freetype过程中发现,从window下拷贝来的simsun.ttc, simkai.ttf两个字体, 在调用 FT_Set_Pixel_Sizes(face, 12, 0): 将字体大小设 ...

  3. URL编码表、Base64编码表、HTTP消息含义

    URL编码表 backspace 8% A 41% a 61% § %A7 Õ %D5 tab 9% B 42% b 62% « %AB Ö %D6 linefeed %0A C 43% c 63% ...

  4. vs的【warning C4996:'fopen': This function or variable may be unsafe】解决方案

    编译警告:warning C4996 与 Security Enhancements in the CRT 将过去的工程用VS2005打开的时候.你有可能会遇到一大堆的警告:warning C4996 ...

  5. Python while for if....else

    1函数input()的工作原理: 函数input()让程序暂停运行,等待用户输入一些文本.获取用户输入后,python将其存储在一个变量(即要向用户显示的提示或说明) raw_input    是Py ...

  6. 基于TCP的socket套接字的网络编程（客户端/服务端模式）

    于数据完整性要求较高的场合,就应采用TCP协议. IP网络层提供IP寻址和路由.因为在网络上数据可以经由多条线路到达目的地,网络层负责找出最佳的传输线路. IP地址与数据包: IP层就是把数据分组从一 ...

  7. CH6202 黑暗城堡

    一道最短路+生成树 原题链接 实际上就是生成树的中每个点到节点\(1\)的距离等于原图中这个点到节点\(1\)的最短距离,求这样的生成树的棵数. 先用\(SPFA\)或\(Dijkstra\)求出所有 ...

  8. Luogu 3620 数据备份 - Set

    Solution 很显然, 最优情况肯定是相邻两个相连 . 然后模型就跟 Luogu1484 类似了. 把两个房子 看成一个坑 (参考 Luogu1484), 选取 $k$ 个不相邻的坑, 使得权值最 ...

  9. P1083龙舟比赛

    题目如下: 现在正在举行龙舟比赛,我们现在获得了最后冲刺时的俯视图像,现在你要输出各条龙舟的名次. 这张图像由r行c列的字符组成,每行的最左边的字符表示起点,所以字符为'S',最右边的字符为'F'.并 ...

  10. 测试 Open Live Writer

    我要试试. 看看图片如何: 这是从电脑端上传的一个例子,如果编辑器里可以支持复制粘贴图片就好了. Open Live Writer 发布以后,还可在保存在本地,想起来的时候就修改一下. 再美化一下. ...