首页  >  文章  >  数据库  >  bootstrap2.3 与 bootstrap3.3 modal嵌入表单的样式改变

bootstrap2.3 与 bootstrap3.3 modal嵌入表单的样式改变

WBOY
WBOY原创
2016-06-07 15:37:30940浏览

2014年12月16日22:55:24 我在做一个ssh的案例的时候,想做一个新增用户的模态框。我用bower下载的bootstrap应该是最新的3.31版本来的,在官网copy了一段模态框效果的原生code,然后在modal-body里面添加如图(1)代码,发现的效果如图(1),行与行之间的input是没

2014年12月16日22:55:24

我在做一个ssh的案例的时候,想做一个新增用户的模态框。我用bower下载的bootstrap应该是最新的3.31版本来的,在官网copy了一段模态框效果的原生code,然后在modal-body里面添加如图(1)代码,发现的效果如图(1),行与行之间的input是没有间距,本来想在tr处添加style="margin-top:10px;",但是不起效果。后来在bootstrap的中文官网看了一下一些实用的案例,但是都没有找到。然后就尝试通过翻墙去bootstrap的英文官网看了一下,虽然行与行之间有了一定的间距,但是每一个Input的宽度都是占满整行,看起来非常不舒服(如图效果(2))。但是我修改之后,效果感觉还不错,如效果图(3),我简单说一下我修改的东西(如图(2)):

1、去掉每个input的class="form-control"这个类
2、通过全局控制样式给每个input添加width:250px,height:30px; line-height:30px
(宽高根据具体设置即可)

我觉真的学习了,分享给大家,希望对大家有帮助!!!



bootstrap2.3 与 bootstrap3.3 modal嵌入表单的样式改变bootstrap2.3 与 bootstrap3.3 modal嵌入表单的样式改变

bootstrap2.3 与 bootstrap3.3 modal嵌入表单的样式改变

bootstrap2.3 与 bootstrap3.3 modal嵌入表单的样式改变

bootstrap2.3 与 bootstrap3.3 modal嵌入表单的样式改变


声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn