实测好用的很~~~

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <title>Document</title>

  <style>

    .outDiv {

      border: 1px solid black;

      width: 200px;

      height: 200px;

      text-align: center;

      overflow: hidden;

    }

    .outDiv .innerDiv1 {

      display: inline-block;

      vertical-align: middle;

    }

    .outDiv .innerDiv-fix {

      display: inline-block;

      width: 0;

      height: 100%;

      line-height: 100%;

      vertical-align: middle;

      visibility: hidden;

    }

  </style>

</head>

<body>

  <div class="outDiv">

    <span class="innerDiv1">多行文字自动换行居中</span><span class="innerDiv-fix">

      <!-- 此标签不能换行 --></span>

  </div>

</body>

</html>

多行文字自动换行居中--实测好用的很OK的更多相关文章

  1. UIlabel多行文字自动换行 （自动折行）

    UIView *footerView = [[UIView alloc]initWithFrame:CGRectMake(, , , )]; UILabel *label = [[UILabel al ...

  2. css设置文字上下居中，一行文字居中，两行或多行文字同样居中。

    转:https://www.cnblogs.com/handsomeBoys/p/6599062.html HTML: <div class="book-detail-store-it ...

  3. css文字上下居中，一行文字居中，两行或多行文字同样居中

    附图: 1. 利用Flex布局实现 demo.html <div class="demo demo-flex"><span>孤云将野鹤,岂向人间住.莫买沃洲 ...

  4. css--实现一个文字少时居中，文字换行时居左的样式

    前言 最近群里的小伙伴去面试,遇到这样一个问题,面试官问:"用 css 对一行文字进行布局,当文字不够换行的时候,这行文字要居中显示,当文字出现换行的时候,这行文字要靠左显示.", ...

  5. 纯CSS实现文字一行居中，多行左对齐的方法

    其实这种需求还是蛮常见的,主要用于产品列表页面,用于产品图片下面,显示产品的名称. 想要实现的效果为: 未知文字长度,当文字长度小于盒子宽度,也就是一行时,文字居中. 当文字长度大于盒子的宽度,会自动 ...

  6. 实现多行文字居中方法（兼容IE6）

    <p class="mulit_line"> <span style="font-size:12px;">这里是高度为150像素的标签内 ...

  7. 多行文字垂直居中（完美兼容chrome firefox IE6 7 8 9）

    在说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少许的CSS Hack技术就可以啊!所以在这里我还要啰嗦两句,CSS中 ...

  8. div垂直居中的N种方法 单行/多行文字(未知高度/固定高度)

    说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少许的 CSSHack技术就可以啊!所以在这里我还要啰嗦两句,CSS中的 ...

  9. div+css使多行文字垂直居中?

    1.单行文字: 设置height = line-height; 多行文字: 设置 padding, 自己要计算一下? vertical-align: 可以设置垂直居中, 但是只是针对本身就具有 ali ...

  10. 多行文字水平垂直居中在div

    <BODY>   <div class="box">    <h3>1.单行文字居中</h3>    <!--设置行高来实现- ...

随机推荐

  1. 13-ORM-更新&删除

    一.更改单个数据 修改单个实体的某些字段 1.查: - 通过get()得到要修改的实体对象 2.改: - 通过对象属性的=的方式修改数据 3.保存 - 通过对象.save()保存数据     二.批量 ...

  2. 空链接的作用以及<a href="#"></a>和<a href="javascript:;"></a>的区别

    空链接的作用以及<a href="#"></a>和<a href="javascript:;"></a>的区别在 ...

  3. centos 7.6镜像_Centos7 配置本地yum源为iso镜像

    创建挂载路径 sudo mkdir /media/iso 挂载ISO镜像到目录 sudo mount -o loop CentOS-7-x86_64-Minimal-1810.iso /media/i ...

  4. Spring Boot 应用的热部署配置

    前言 所谓热部署,简单来说,就是代码修改后不需重启项目就可自动加载出新的内容. 注意:热部署在 debug 调试模式下才生效! IDEA 配置 在 IDE(IDEA)中开启相关项目自动构建选项 开启编 ...

  5. ModuleNotFoundError: No module named 'XXX'

    先来一张表情包: pycharm在小黑框使用pip安装某个包,在解释器没有找到某个包,所以运行程序的时候总是报错. 我相信大家可能都遇到这样的问题. 我下载有3.8.3.10版本的python,我py ...

  6. Java：ArrayList的基本使用（学习笔记）

    ​ 集合和数组的对比(为什么要有集合) 分为俩点 1. 长度:数组的长度是固定的,集合的长度是可变的. 2. 存储类型: 数组:可以存储基本数据类型,引用数据类型. 集合:只能存储引用数据类型. 小t ...

  7. 【红队技巧】Windows存储的密码获取

    [红队技巧]Windows存储的密码获取 免责声明: 使用前提 支持版本 利用方式 参考: 免责声明: 本文章仅供学习和研究使用,严禁使用该文章内容对互联网其他应用进行非法操作,若将其用于非法目的,所 ...

  8. windows安装wsl，在windows中使用ubuntu

    WSL(Windows Subsystem for Linux)即适用于 Linux 的 Windows 子系统,它是随 Windows 操作系统一起提供. WSL是windows操作系统的子系统,算 ...

  9. [排序算法] 2路插入排序 (C++)

    前言 本文章是建立在 插入排序 的基础上写的,如果还有不懂 插入排序 的童鞋先停下脚步,可以先看看这里~ 直接/折半插入排序 2路插入排序解释 在 插入排序 中,当待插入元素需要插入的位置位于当前有序 ...

  10. i春秋GetFlag

    进去是个提示界面,提示我们这是个迷你文件管理系统,我们需要登录然后下载文件再获得flag. 然后我们查看源码,没什么信息,点login进去查看源码,没什么信息 下方出现了一个substr(md5(ca ...