Question

我正在制作一个带引导程序的网站，当我将border-radius：4px添加到输入/按钮时，也会添加阴影。

检查图片： http://i.stack.imgur.com/K9pz8.png

如何删除此影子？

Answer 1

将class="form-control添加到输入元素中，它将删除内部的阴影。

参见演示：

＆＃13;

/* Latest compiled and minified CSS included as External Resource*/

/* Optional theme */

@import url('//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css');
 body {
  margin: 10px;
}
input {
  border-radius: 5px;
  margin: 10px;
}

＆＃13;

<link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" />
<div class="container">
  <div class="input-group">
    <input type="text" class="" placeholder="without class">
    <input type="text" class="form-control" placeholder="with class">
  </div>
</div>

＆＃13;

Answer 2

试试这个

＆＃13;

#usr{
  border-radius:4px;
}

＆＃13;

<div class="col-md-4"><div class="form-group">
      <label for="usr">Name:</label>
      <input type="text" class="form-control" id="usr">
    </div>
  </div>

＆＃13;

注意：已添加class = "form-control"。

演示Here

Bootstrap border-radius：4px正在为输入添加阴影

2 个答案: