Home > Web Front-end > HTML Tutorial > div的垂直居中_html/css_WEB-ITnose

div的垂直居中_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 11:23:48
Original
1027 people have browsed it

之前一直不会垂直居中,看了一篇文章才知道  原地址 不详了..

 1 .diva{ 2       width:300px; 3       height:300px; 4       background-color:green; 5       position:absolute; 6       top:0; 7       right:0; 8       bottom:0; 9       left:0;10       margin:auto;11 }12 这是一种垂直居中的方式。13 14 第二种兼容比较好15 16 .divb{17       width:300px;18       height:300px;19       background-color:red;20       position:absolute;21       top:50%;22       right:0;23       left:0;24       margin:auto;25       margin-top:-150px;//一半的高度26 }
Copy after login

第一次写博客 不好之处大家见谅 有更好的方法或者错误欢迎指出。

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template