div中多行内容垂直居中显示

一、css 样式

    .wrap {

      height: 200px;

      width: 200px;

      border: 1px solid #232323;

      display: flex;

      justify-content: center;

      flex-direction: column;

    }

二、效果图

三、完成代码示例

<html>

<header>

  <title>div中内容垂直居中</title>

  <style>

    .wrap {

      height: 200px;

      width: 200px;

      border: 1px solid #232323;

      display: flex;

      justify-content: center;

      flex-direction: column;

    }

  </style>

</header>

<body>

  <div class="wrap">

    <span>显示内容1</span>

    <span>显示内容2</span>

  </div>

</body>

</html>

div中多行内容垂直居中显示的更多相关文章

  1. IE8下div中2个button仅仅显示一个

    IE8下div中2个button仅仅显示一个,代码例如以下: <div id="adviceType" style="display: none;" &g ...

  2. 读取memo中某行内容

    方法1 可用以下代码读取Memo中指定行的内容: var   aLine:String; begin   aLine:=Memo1.Lines[2]; end; 在使用中,读取的行在Memo中需要保证 ...

  3. div中文字水平和垂直居中的css代码

    HTML元素 <div>水平垂直居中</div> css样式 div{ width:200px;height:200px; /*设置div的大小*/ border:1px so ...

  4. [daily][troubleshoot][archlinux][wps][font] wps文档中的图内容无法显示中文

    序 用linux作为工作生产环境的几个需要解决的问题之一是:文档协作,即如何兼容Micro$oft Office格式的文档. 我一般的工作方式是:在linux下创建一个win7的虚拟机,安装常用的wi ...

  5. ASP.NET中读取excel内容并显示

    项目中经常会用到把excel的文件内容导入到数据库中的,刚刚花了点时间,做了个例子,基本上能实现导入Excel后显示的功能吧,导入的excel文件得是xls,即是2003的.     代码思路如下:要 ...

  6. 让块元素在div中水平居中，并且垂直居中的五种方法

    在写代码前,先做下准备工作,写两个div,设置下div的大小,把小的div放在大的div里面.可以给小的div设置下颜色,方便观看. 方法一:写一个伪元素,将它设置为行内块元素,高度与父元素相同,写一 ...

  7. div中文本水平居中，垂直居中

    div: text-align=center; hight=100px; line-hight=100px;(行高需要和高度设置成一样)

  8. html如何让label在div中的垂直方向居中显示？

    设置label的行高 line-height 和div的高度一致即可.

  9. 使用window.getSelection()获取div中选中文字内容及位置

    div添加一个弹出事件: $(document).ready(function () { $("#marked-area").mouseup(function (e) { $sco ...

  10. 仅支持webkit浏览器的多行内容超出显示省略号

    .box { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; ...

随机推荐

  1. [oeasy]python0010_怎么用命令行保存文件

    编写 py 文件 回忆上次内容 上次 真的输出了 程序员的浪漫 Hello world!   print函数 可以输出 字符串 但是 print这个词 别拼错 就连 大小写 也别能错 错了就改 也没事 ...

  2. oeasy教您玩转vim - 23 - 配置文件

    配置文件 回忆上节课内容 我们上次找到配置文件的位置 ~/.vimrc 了解各种配置开关 修改配置文件并应用 这次想了解和配色方案相关的内容 colorscheme vi ~/.vimrc.old 中 ...

  3. Django 继承AbstractUser扩展用户模型

    Django 继承AbstractUser扩展用户模型 by:授客 QQ:1033553122 测试环境 Win 10   Python 3.5.4   Django-2.0.13.tar.gz 官方 ...

  4. 蓝图中如何存储树结构： NPC对话的打开方式

    BFS来扩展成数组, 然后每一个node节点的child存储为索引.

  5. 新年切红包-scratch小游戏

    程序说明: <新年切红包>是一款Scratch制作的小游戏,灵感来源于流行的切水果游戏.在这个游戏中,玩家需要用鼠标切割屏幕上不断飞出的红包,切割到红包将获得金币奖励,而切割到爆竹则会导致 ...

  6. 【Java】三元运算符 类型提升 问题

    代码片段: @Test public void test() { Object o = true ? new Integer(1) : new Double(2); System.out.printl ...

  7. 【JavaScript】从N个下拉动态监听改变的option值

    同事因为这个问题人傻了,是从Ajax请求获取的动态数据遍历的表格 然后表格行的单元格又有下拉选择,有N个下拉,要取出选择的值进行二次请求 <select name="A" i ...

  8. attention机制、LSTM二者之间，是否存在attention一定优于LSTM的关系呢？

    这里没有严格的论证,只是自己的一些理解. attention机制下的Transformer确实是当前AI技术中最为火热的,基于其构建的大语言模型可以说是AI技术至今最强的技术之一了,但是attenti ...

  9. Ubuntu18.04系统下 临时使用 socks5代理apt-get的方法

    参考: https://www.cnblogs.com/iwetuan/p/13567810.html ------------------------------------------------ ...

  10. ubuntu18.04 安装wine64出现错误： X 64-bit development files not found.

    ubuntu18.04 编译源码方式安装  wine6.11 ,   报错: 缺少依赖,解决方法如下: sudo apt install xserver-xorg-dev 参考: https://bl ...