css3 - 在 bootsrap css中,嵌套类属性集

  显示原文与译文双语对照的内容
0 0

我的代码 block 看起来像这样

<div class="form-group">
 <label for="inputPassword3" class="col-sm-2 control-label">Password</label>
 <div class="col-sm-10">
 <input type="password" class="form-control" id="inputPassword3" placeholder="Password">
 </div>
 </div>

现在,我想为这个 block 设置窗体控件类宽度 30 % 。表单组> col-sm-10> 表单控件。 谢谢

时间:原作者:7个回答

0 0

你可以以这样做:

Bootply 演示插件

HTML:

<div class="form-group">
 <label for="inputPassword3" class="col-sm-2 control-label">Password</label>
 <div class="col-sm-10">
 <input type="password" class="form-control" id="inputPassword3" placeholder="width = 30%">
 </div>
</div>

CSS:

@media (min-width: 768px){
. form-group>. col-sm-10>. form-control {
 width: 30%;
 }
}
原作者:
0 0

如果你希望将宽度设置为,则你可以尝试使用 inline 编码。

<div class="form-group">
 <label for="inputPassword3" class="col-sm-2 control-label">Password</label>
<div class="col-sm-10">
 <input type="password" style="width:30%" class="form-control" id="inputPassword3" placeholder="Password">
</div>
</div>
原作者:
...