CSS - div居中在屏幕中(水平居中 + 垂直居中)
方法一代码
<div>
<h1>404 Not Found.</h1>
</div>
<style>
div {
text-align: center;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
</style>
在新Tab打开

方法二代码
.vertical-container {
height: 300px;
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: center;
justify-content: center;
}
CSS - div居中在屏幕中(水平居中 + 垂直居中)的更多相关文章
- css div居中
div中没有text-align和vehicle-align这两个属性,所在在css中设置这两个值没有作用 div 水平居中 设置左右边距有auto div{ margin: 0 auto; } 垂直 ...
- 用CSS 实现 非浮动元素的 水平居中/垂直居中/水平垂直居中
一.水平居中 (1)行内元素解决方案 只需要把行内元素包裹在一个属性display为block的父层元素中,并且把父层元素添加如下属性即可: .parent { text-align:center ...
- CSS——div居中,window.open(0
margin:0 auto 表示什么意思?? margin后面如果只有两个参数的话,第一个表示top和bottom,第二个表示left和right因为0 auto,表示上下边界为0,左右则根据宽度自适 ...
- css div居中显示的4种写法
Demo:http://www.feman.cn/h5/center.html .absolute 绝对定位 这是我们最常用的一种居中定位写法 要求必须确定div的宽高度 目前市面上的浏览器基本上都支 ...
- 结构-行为-样式-Css Div 居中的一个最佳实践
最近在做项目的时候,经常会有需要各种居中的情况,现在分享一个最佳实践. <div class="success-bottom"> <div class=" ...
- CSS DIV 居中
左右居中 margin-left: auto; margin-right: auto; 上下居中
- HTML+CSS,让div在屏幕中居中(水平居中+垂直居中)方法总结
最近写网页经常需要将div在屏幕中居中显示,遂记录下几个常用的方法,都比较简单. 水平居中直接加上<center>标签即可,或者设置margin:auto;当然也可以用下面的方法 下面说两 ...
- 【转】CSS中怎么让DIV居中
来源:http://www.cnblogs.com/DebugLZQ/archive/2011/08/09/2132381.html CSS 如何使DIV层水平居中 今天用CSS碰到个很棘手的 ...
- CSS中怎么让DIV居中(转载)
CSS 如何使DIV层水平居中 今天用CSS碰到个很棘手的问题,DIV本身没有定义自己居中的属性, 网上很多的方法都是介绍用上级的text-align: center然后嵌套一层DIV来解决问题. 可 ...
随机推荐
- HDU 1542 Atlantis(扫描线算法)
题意:给出n个矩形的左下角左边和右上角坐标,求这n个矩形的面积并 原题链接:http://acm.hdu.edu.cn/showproblem.php?pid=1542 典型的扫描线算法的题目 什么是 ...
- opencv:程序运行完保持dos窗口不关闭
(1)在main函数最后加上 system("pause"); 第一种不能加到含有imshow图片显示的结尾:否则会不能显示图片: (2)利用cvWaitKey()函数: 这种能加 ...
- Python 编辑注意点
文本编辑 Python: 绝对不能用Word和Windows自带的记事本. (1)Word保存的不是纯文本文件 (2)记事本会自作聪明地在文件开始的地方加上几个特殊字符(UTF-8 BOM),结果会导 ...
- NVMe over Fabrics 概况
NVMe over Fabrics 技术特征 跨网络传输NVMe命令需要特殊的考虑,而不仅仅是针对本地存储内存.例如,为了远距离传输NVMe协议,理想的底层网络或fabric技术将具有以下特性: 可靠 ...
- [WC2006] 水管局长 - Link Cut Tree
离线后逆序处理所有操作,那么就变成了加边询问,根据MST的性质,显然维护MST询问链上max即可 #include <bits/stdc++.h> using namespace std; ...
- Intellij-Idea使用小细节
SpringMVC项目部署到tomcat中文乱码,tomcat的配置里面加上 -Dfile.encoding=UTF-8
- AC3 IMDCT
AC3 encoder 在进行MDCT时,使用两种长度的block. 512 samples的block用于输入信号频谱是stationary,或者在时间上变化缓慢.在fs 为48k时,使用512 s ...
- HTML学习(14)表单
HTML 表单用于收集不同类型的用户输入. HTML 表单 表单是一个包含表单元素的区域. 表单元素是允许用户在表单中输入内容,比如:文本域(textarea).下拉列表.单选框(radio-butt ...
- 每天进步一点点------Allegro 铺铜、内电层分割
一.Allegro 铺铜 1.建议初学者内电层用正片,因为这样就不用考虑flash焊盘,这时候所有的过孔和通孔该连内电层的就连到内电层,不该连的就不连.而如果用负片,那么如果做焊盘的时候如果没有做fl ...
- Java通过反射读取泛型
1.在这里有必要先提一句关于javabean,建议有一个构造器,而不是必须要写的,这是一个良好的习惯. 这样做肯定是有好处的,如果你的一个类写了带参的构造方法,而没有写空的构造方法,那么,如有有一个类 ...