多行文字自动换行居中--实测好用的很OK
实测好用的很~~~
<!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的更多相关文章
- UIlabel多行文字自动换行 (自动折行)
UIView *footerView = [[UIView alloc]initWithFrame:CGRectMake(, , , )]; UILabel *label = [[UILabel al ...
- css设置文字上下居中,一行文字居中,两行或多行文字同样居中。
转:https://www.cnblogs.com/handsomeBoys/p/6599062.html HTML: <div class="book-detail-store-it ...
- css文字上下居中,一行文字居中,两行或多行文字同样居中
附图: 1. 利用Flex布局实现 demo.html <div class="demo demo-flex"><span>孤云将野鹤,岂向人间住.莫买沃洲 ...
- css--实现一个文字少时居中,文字换行时居左的样式
前言 最近群里的小伙伴去面试,遇到这样一个问题,面试官问:"用 css 对一行文字进行布局,当文字不够换行的时候,这行文字要居中显示,当文字出现换行的时候,这行文字要靠左显示.", ...
- 纯CSS实现文字一行居中,多行左对齐的方法
其实这种需求还是蛮常见的,主要用于产品列表页面,用于产品图片下面,显示产品的名称. 想要实现的效果为: 未知文字长度,当文字长度小于盒子宽度,也就是一行时,文字居中. 当文字长度大于盒子的宽度,会自动 ...
- 实现多行文字居中方法(兼容IE6)
<p class="mulit_line"> <span style="font-size:12px;">这里是高度为150像素的标签内 ...
- 多行文字垂直居中(完美兼容chrome firefox IE6 7 8 9)
在说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少许的CSS Hack技术就可以啊!所以在这里我还要啰嗦两句,CSS中 ...
- div垂直居中的N种方法 单行/多行文字(未知高度/固定高度)
说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少许的 CSSHack技术就可以啊!所以在这里我还要啰嗦两句,CSS中的 ...
- div+css使多行文字垂直居中?
1.单行文字: 设置height = line-height; 多行文字: 设置 padding, 自己要计算一下? vertical-align: 可以设置垂直居中, 但是只是针对本身就具有 ali ...
- 多行文字水平垂直居中在div
<BODY> <div class="box"> <h3>1.单行文字居中</h3> <!--设置行高来实现- ...
随机推荐
- nrf9160做modem——测试连接阿里云
简介:在前面有讲过如何使用nrf9160去连接一个云,然后进行发布订阅信息,但是当时连接的是一个免费的测试云,在国内的话许多人想要连接阿里云或者华为云,下面就来测试一下连接阿里云.这里为什么要和上一篇 ...
- 十三、Pod的资源控制器类型
Pod 的资源控制器类型 一.Pod 的资源控制器类型 什么是控制器呢?简单来说,控制器就好比是影视剧里面的剧本,演员会根据剧本所写的内容来针对不同的角色进行演绎,而我们的控制器就好比是剧本,Kube ...
- CVE-2021-44832 log4j_2.17.0 RCE复现与吐槽
先说一句,这傻x洞能给cve就离谱,大半夜给人喊起来浪费时间看了一个小时. 先说利用条件: 需要加载"特定"的配置文件信息,或者说实际利用中需要能够修改配置文件(你都能替换配置文件 ...
- windows下 安装docker
一.Docker 1.什么是docker 对比 特性 容器 虚拟机 启动 秒级 分钟级 磁盘使用 一般为MB 一般为GB 性能 接近原生 弱于 系统支持量 单机支持上千个容器 一般几十个 2. 使用d ...
- JS 学习笔记 (六) 函数式编程
1.函数闭包 1.1 概述 JavaScript采用词法作用域,函数的执行依赖于变量作用域,这个作用域是在函数定义时决定的,而不是函数调用时决定的. 为了实现这种词法作用域,JavaScript函数对 ...
- fastposter v2.10.0 简单易用的海报生成器
fastposter海报生成器是一款快速开发海报的工具.只需上传一张背景图,在对应的位置放上组件(文字.图片.二维.头像)即可生成海报. 点击代码直接生成各种语言的调用代码,方便快速开发. 现已服务众 ...
- 【实操日记】使用 PyQt5 设计下载远程服务器日志文件程序
最近通过 PyQt5 设计了一个下载服务器指定日期日志文件的程序,里面有些有意思的技术点,现在做一些分享. PyQt5 是一套 Python 绑定 Digia Qt5 应用的框架,是最强大的 GUI ...
- MLP(SGD or Adam) Perceptron Neural Network Working by Pytorch(including data preprocessing)
通过MLP多层感知机神经网络训练模型,使之能够根据sonar的六十个特征成功预测物体是金属还是石头.由于是简单的linearr线性仿射层,所以网络模型的匹配度并不高. 这是我的第一篇随笔,就拿这个来练 ...
- 元数据Metadata到底有什么用
什么是元数据 元数据Metadata很简单,是关于数据的数据.这就意味着是数据的描述和上下文.他有助于组织和发现理解数据. 举例: 1张照片中除了照片本身还是,照片的时间日期,大小,格式相机设置,地理 ...
- 决策树(二):后剪枝,连续值处理,数据加载器:DataLoader和模型评估
在上一篇文章中,我们实现了树的构造,在下面的内容中,我们将中心放在以下几个方面 1.剪枝 2.连续值处理 3.数据加载器:DataLoader 4.模型评估 一,后剪枝 • 为什么剪枝 –" ...