整个页面所有元素垂直居中

简介: 1 DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 2 3 4 5 无标题文档 6 7 html,...
 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
 2 <html>
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 5 <title>无标题文档</title>
 6     <style type="text/css">
 7         html,body
 8         {
 9             height:100%;
10             margin:0;
11         }
12         body
13         {
14             -webkit-align-items:center;
15             -ms-flex-align:center;
16             align-items:center;
17             display:-webkit-flex;
18             display:flex;
19         }
20     </style>
21 </head>
22 
23 <body>
24     <div style="height:500px; width:400px; background-color:#095;margin-left:auto;margin-right:auto;">
25         aSDadasdASD
26         <BR/><BR/><BR/><BR/><BR/><BR/>
27         342532523543
28         <BR/><BR/><BR/><BR/><BR/><BR/>
29     </div>
30 </body>
31 </html>

 

 

相关文章
|
6月前
【奇技淫巧】实现flex布局中,单独某个元素挪到右侧、底部,与其他元素排列不同,就像是个另类。(主要是用到margin-left和align-self)
【奇技淫巧】实现flex布局中,单独某个元素挪到右侧、底部,与其他元素排列不同,就像是个另类。(主要是用到margin-left和align-self)
|
前端开发
css:flex布局最后一个子元素靠右摆放
css:flex布局最后一个子元素靠右摆放
861 0
css:flex布局最后一个子元素靠右摆放
|
4月前
|
前端开发
css实战——清除列表中最后一个元素的下边距
css实战——清除列表中最后一个元素的下边距
82 0
|
6月前
|
前端开发 容器
css样式元素的相对定位,绝对定位,固定定位等元素定位运用技巧详解
css样式元素的相对定位,绝对定位,固定定位等元素定位运用技巧详解
元素居中的几种方式
元素居中的几种方式
67 0
|
前端开发 容器
CSS 元素居中方式总结
CSS 元素居中
108 0
【元素水平垂直居中的方法有哪些?元素不定宽高呢?】
【元素水平垂直居中的方法有哪些?元素不定宽高呢?】
【元素水平垂直居中的方法有哪些?元素不定宽高呢?】
元素水平垂直居中的六种方法
元素水平垂直居中的六种方法
88 1
|
移动开发
操作元素样式
操作元素样式
div盒子水平垂直居中以及表格的居中的方法
div盒子水平垂直居中以及表格的居中的方法
146 0