实现bootstrap 模态框(Modal)居中

复制代码
实现bootstrap 模态框(Modal)居中

进阶中的小檀

已于 2022-05-10 08:56:51 修改

1334
 收藏 5
文章标签: bootstrap css
版权
工作中使用到bootstrap的模态框,但是这个东西好像没有提供居中的属性,看了网上的大多都是使用js重新计算模态框的位置,感觉太麻烦。所以研究了一下,发现重写class就行了~~~~

bootstrap版本 :3.3.7

默认的效果图

修改后的效果图;还可以哈~

**

修改方法重写class:
必须要能覆盖之前的样式,不然不能其效果…
**

   .modal {
            width:100%;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
          }

欢迎访问 个人网站
————————————————
版权声明:本文为CSDN博主「进阶中的小檀」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/qq_35260798/article/details/109181707
复制代码

 

posted @   前端白雪  阅读(526)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· Manus的开源复刻OpenManus初探
· AI 智能体引爆开源社区「GitHub 热点速览」
· C#/.NET/.NET Core技术前沿周刊 | 第 29 期(2025年3.1-3.9)
· 从HTTP原因短语缺失研究HTTP/2和HTTP/3的设计差异
点击右上角即可分享
微信分享提示