最新消息:文章中包含代码时,请遵守代码高亮规范!

巧妙运用css让弹窗居中【原创】

HTML+CSS Cindy 107浏览 0评论

在开发项目时,有时候需要登录界面或者弹窗要始终居中在电脑屏幕中间,由于屏幕大小不确定,不用js,仅用margin-top和margin-left难以使弹窗刚好显示在屏幕中间。

以下是实现弹窗居中具体代码,大家可以参考一下。

弹窗样式代码:

.mask {
   position: fixed;
   top: 50%;
   left: 50%;
   margin-top: -200px;
   margin-left: -300px;
   width: 600px;
   height: 400px;
   overflow: hidden;
   background: #ffffff;
}

 

 

转载时请注明出处及相应链接,本文永久地址:http://blog.it985.com/22898.html

您必须 登录 才能发表评论!