position: absolute;
top: 20%;
left: 50%;
transform: translateX(-50%);
-ms-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-o-transform: translateX(-50%);

css上下居中的更多相关文章

  1. 【转】css布局居中和CSS内容居中区别和对应DIV CSS代码

    原文地址:http://www.divcss5.com/jiqiao/j771.shtml css布局居中和CSS内容居中区别和对应DIV CSS代码教程与图文代码案例篇 对于新手来说DIV CSS布 ...

  2. 使用Flexbox实现CSS竖向居中

    竖向居中需要一个父元素和一个子元素合作完成. <div class="flexbox-container"> <div>Blah blah</div& ...

  3. CSS标签居中

    CSS标签居中是相对于父标签说的,即在父标签的中居中.通常是在子标签中使用margin:0 auto,来使子标签居中.此外子标签需要有固定的宽度才行,比如 子标签为div时,div的宽度默认占父标签的 ...

  4. css常用居中

    对一个已知大小的元素上下左右居中(已知大小了,直接margin也就行了): css如下:.parent{height:100px;width:100px;background:grey;positio ...

  5. CSS 图像居中对齐

    CSS  图像居中对齐 我们在<CSS 内外边距>学过内容居中,它的原理是将外边左右设置为auto.图像居中也是这个原理. 示例 <!DOCTYPE html> <htm ...

  6. css图片居中(水平居中和垂直居中)

    css图片居中(水平居中和垂直居中) css图片居中分css图片水平居中和垂直居中两种情况,有时候还需要图片同时水平垂直居中,下面分几种居中情况分别介绍. css图片水平居中 利用margin: 0 ...

  7. CSS中居中的完全指南（中英对照翻译）

    翻译自:https://css-tricks.com/centering-css-complete-guide/ Centering things in CSS is the poster child ...

  8. css左右居中的几种常见方法

    本人是前端的新人,这是第一次写技术博客,各位大大,本文有错误请指正,手中的板砖尽量轻拍,我怕疼~~ 对于水平居中和垂直居中我也用过很多方法,但是有的时候管用有的时候又嗝屁不好使了.涉及到的情况很多,所 ...

  9. 用CSS实现居中的方式

    直接放链接吧,最近大量时间放在看书上了,不想玩游戏,不想看电影,只想看书,早日做出自己的网站卖广告. CSS居中

  10. CSS布局——居中

    参考文章1.CSS布局奇淫技巧之--各种居中 2.http://www.imooc.com/article/2235 1.行内元素水平居中text-align:center对图片,按钮,文字等行内元素 ...

随机推荐

  1. Fiddler抓包ios设备

    Fiddler绝对称得上是"抓包神器", Fiddler不但能截获各种浏览器发出的HTTP请求, 也可以截获各种智能手机发出的HTTP/HTTPS请求. Fiddler能捕获ISO ...

  2. Python 中更安全的 eval

    问题 想要将一段列表形式的字符串转为 list,但是担心这个动态的字符串可能是恶意的代码?使用 eval 将带来安全隐患.比如: # 期望是 eval('[1, 2, 3]') # 实际上是 eval ...

  3. CF615A Bulbs 题解

    Content 有 \(n\) 个灯,一开始它们都是关着的.有 \(m\) 个按钮,每个按钮可以开 \(k\) 盏灯.求能否通过这 \(m\) 个按钮使得所有灯全部都开着. 数据范围:\(1\leqs ...

  4. CF916A Jamie and Alarm Snooze 题解

    Content 令一个时间为幸运时间,当且仅当该时间中包含数字 \(7\). 小 J 很懒,他决定在 \(h\) 时 \(m\) 分起床,于是他将闹钟设定在一个很幸运的时间,并通过按一次按钮以多睡 \ ...

  5. CF1547B Alphabetical Strings 题解

    Content 我们有一个空的字符串,第 \(i\) 次操作我们可以将字母表中第 \(i\) 个字母加入字符串的最前面或最后面.我们称一个长度为 \(n\) 的字符串是合法的,当且仅当这个字符串可以通 ...

  6. java 网络编程基础 InetAddress类；URLDecoder和URLEncoder；URL和URLConnection；多线程下载文件示例

    什么是IPV4,什么是IPV6: IPv4使用32个二进制位在网络上创建单个唯一地址.IPv4地址由四个数字表示,用点分隔.每个数字都是十进制(以10为基底)表示的八位二进制(以2为基底)数字,例如: ...

  7. CSS 常用颜色代号

    常用颜色代号一览表:http://www.divcss5.com/html/h636.shtml   #000000   #2F0000   #600030   #460046   #28004D   ...

  8. Mybatis-Plus一键生成代码

    Mybatis-Plus一键生成代码 一.闲言碎语 闲来无事看了看了MP的官网看到一键生成的代码更新了! 整个Ui风格都变了,遂决定瞅一眼新的代码生成器 官网地址~~ 二.引入依赖 新的代码生成只有在 ...

  9. 【LeetCode】898. Bitwise ORs of Subarrays 解题报告（Python）

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 动态规划 相似题目 参考资料 日期 题目地址:htt ...

  10. 【LeetCode】210. Course Schedule II 解题报告（Python）

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 拓扑排序,BFS 拓扑排序,DFS 参考资料 日期 ...