原理很简单,主要记住以下3点:
第一点要求:position:absolute
第二点要求:left:50%;top:50%
第三点要求:margin-left:-175px [也就是-(350/2)] margin-top:-150px [也就是-(300/2)]
原理:
先让这个DIV绝对定位;
让他距离上边50%,左边50%;这会这个DIV的左上角这个点就是窗口的正中间;
因为已经知道了这个DIV的高和宽了,那么再从这里点向左移动总宽及高的一半就可以了.
举例:
<div style="width:350px;height:300px;position:absolute;left:50%;top:50%; margin-top:-150px;margin-left:-175px;border:solid #000 5px;">
</div>
<style type="text/css">
<!--
div {
position: absolute; /*绝对定位*/
top: 50%; /* 距顶部50%*/
left: 50%; /* 距左边50%*/
height: 200px; margin-top: -100px; /*margin-top为height一半的负值*/
width: 400px; margin-left: -200px; /*margin-left为width一半的负值*/
}
-->
</style>
按字母顺序浏览:A B C D E F G H I J K L M N O P Q R S T U V W X Y Z
→我们致力于为广大网民解决所遇到的各种电脑技术问题 如果您认为本词条还有待完善,请 编辑词条
上一篇如何优化WiFi网络
下一篇服务器维护的四点注意