CSS文本垂直居中显示
<style>
.sty1 {
width: 300px;
height: 200px;
background-color: black;
text-align: center;
color: white;
font-size: 30px;
margin: 20px auto;
} .sty2 {
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: center;
justify-content: center;
}
</style> <body>
<div class="sty1 sty2">
this is title
</div>
</body>
效果:

CSS文本垂直居中显示的更多相关文章
- css文本垂直居中的实现
本案例已经有新的比较简便的解决方案,可以直接采用 vertical-align:middle 样式对行内元素进行垂直居中布局,详见: 微信小程序开发——如何让商品标题类文本根据内容长度垂直居中. 以下 ...
- CSS文本溢出显示省略号
项目中常常有这种需要我们对溢出文本进行"..."显示的操作,单行多行的情况都有(具体几行得看设计师心情了),这篇随笔是我个人对这种情况解决办法的归纳,欢迎各路英雄指教. 单行 语法 ...
- CSS 文本垂直居中对齐
文本垂直居中对齐是一个很常见的问题,这里总结一下. 一.容器高度固定,单行文本垂直居中对齐 height:20px; line-height:20px; overflow:hidden; 二.容器高度 ...
- css 文本省略号显示
文本省略号是非常常见的需求,而省略号展示又通常分为俩种情况折行和不折行.不折行: div { white-space:nowrap;/* 规定文本是否折行 */ overflow: hidden;/* ...
- css 文本单行显示溢出时出现省略号 多行显示溢出时出现省略号 首行缩进
一.文本单行显示溢出时出现省略号 二.文本多行显示溢出时出现省略号(这种样式只能在webkit和移动端使用,包括小程序,不能设置固定高度) 三.首行缩进两字符 text-indent: 2em; 四. ...
- css 文本两行显示,超出省略号表示
重点:text-overflow: ellipsis;只对display:inline:起作用 例子: <span class="a">我说说<b class= ...
- css 文本溢出显示省略号
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- css文本内容显示省略号
文字显示省略号width: 4.5rem;overflow: hidden;white-space: nowrap;text-overflow: ellipsis; 但是这个属性只支持单行文本的溢出显 ...
- CSS文本居中显示
因为一直为元素居中问题而困扰,所以决定把自己遇到和看到的方法记录下来,以便以后查看 如果要让inline或inline-block元素居中显示,则父元素css中包含text-align:center; ...
随机推荐
- idea maven打jar包
双击clean install 会在根目录targer生成文件(注意删除test和替换yml文件)
- MySQL数据库基本操作以及SQL语句
连接mysql的语法 mysql -u用户名 -p密码 [-h主机名] [-P端口号] 在一个mysql服务器中, 可以有多个mysql数据库(本质是一个文件夹) 在一个mysql数据库中, 可以有多 ...
- Mybatis缓存+配置
mybatis提供了缓存机制减轻数据库压力,提高数据库性能 mybatis的缓存分为两级:一级缓存.二级缓存 一级缓存是SqlSession级别的缓存,缓存的数据只在SqlSession内有效 二级缓 ...
- PHP filter_list() 函数
定义和用法 filter_list() 函数返回包含所有得到支持的过滤器的一个数组. 语法 filter_list() 提示和注释 注释:该函数的结果不是过滤器 ID,而是过滤器名称.请使用 filt ...
- Comet OJ 三元组 推导+两个指针+分类讨论
题目:https://www.cometoj.com/contest/59/problem/F?problem_id=2681 题意:给你n个三元组 ai,bi,ci,如果某一对三元组满足 2* ...
- redis安装-1
redis安装 cd /opt/tools/ #包目录 tar -xf redis-.tar.gz cd redis- make#centos7安装 make MALLOC=libc && ...
- percona-toolkit工具包的安装和初步使用
percona-toolkit工具包的安装和初步使用 原文地址:http://blog.csdn.net/yumushui/article/details/42919601 一.percona-too ...
- 分布式系统理论基础2 :CAP
本文转自:https://www.cnblogs.com/bangerlee/p/5328888.html 本系列文章将整理到我在GitHub上的<Java面试指南>仓库,更多精彩内容请到 ...
- 【从0到1,搭建Spring Boot+RESTful API+Shiro+Mybatis+SQLServer权限系统】05、Shiro集成
1.POM文件中加入Shiro和fastJSON依赖 <dependency> <groupId>org.apache.shiro</groupId> <ar ...
- 04 循环结构概述和for语句的格式及其使用
04.01_Java语言基础(循环结构概述和for语句的格式及其使用) A:循环结构的分类 for,while,do…while B:循环结构for语句的格式: for(初始化表达式;条件表达式;循环 ...