html - 我可以选择包含输入字段的 div 吗？

Question

我想知道当 div 有一个 input 字段作为子项时，我是否可以选择它。

这是我正在使用的 HTML:

<div class="xxx">
    <div class="panel panel-success">
      <div class="panel-heading">
        <h3 class="panel-title">my title</h3>
      </div>
      <div class="panel-body">
        <div class="row">
            <div class="col-md-5">some content</div>
            <div class="col.md-7">some content</div>
        </div>
        <div class="row">
            <div class="col-md-5">some content</div>
            <div class="col-md-3">
                <input type="text" class="form-control" id="date" />
            </div>
        </div>
      </div>
    </div>
</div>

如果所有 div block 都有 col-* 类，Bootstrap 会添加填充和边距。我想要实现的是，如果一个 div 包含一个 input 字段，那么 margin 和 padding 应该设置为 0px。

所以主要的问题是:“我可以根据他的内容选择一个div吗？”

我尝试了 div[class*="..."] 和 div[class^="..."]，但都没有解决我的问题.

Answer 1

您可以选择替代策略。您可以向这些 div 添加一个类，并使用 css 规则应用零填充和边距。

<div class="col-md-3 zero-padding-margin">
            <input type="text" class="form-control" id="date" />
        </div>

和

  .zero-padding-margin {
margin: 0;
padding: 0;
}