我的问题是我需要为一个 bootstrap 网格列背景着色，而不是为整个网格列着色，除了默认填充之外，在网格上添加背景颜色。
HTML
<div class="row">
<div class="col-lg-3 col-md-12 col-sm-12 faq-box">
<div class="faq-titile">
<h4>faq title</h4>
</div>
</div>
<div class="col-lg-9 col-md-12 col-sm-12 pl-0">
.......
</div>
</div>
CSS
.faq-box{
margin: 0;
padding: 30px;
background-color:#EBF3FF ;
}
在列内添加一个div，然后给这个div添加背景。：
.padding-here{
padding:2em;
background:#c4c4c4;
width:200px;
height:200px;
border:1px solid black;
}
.padding-here-too{
padding:2em;
width:200px;
height:200px;
border:1px solid black;
}
.padding-here-too div{
background:#c4c4c4;
height:100%;
}<div class="padding-here">padding here</div>
<div class="padding-here-too">
<div>
padding here too
</div>
</div>如果您使用 box-sizing: border box，则宽度中将包含内边距和边框。
.faq-box{
box-sizing: border-box;
margin: 0;
padding: 30px;
background-color:#EBF3FF ;
}<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css">
<div class="row">
<div class="col-lg-3 col-md-12 col-sm-12 faq-box">
<div class="faq-titile">
<h4>faq title</h4>
</div>
</div>
<div class="col-lg-9 col-md-12 col-sm-12 pl-0">
.......
</div>
</div>这些例子很清楚：
body {
display: flex;
flex-direction: row;
justify-content: space-between;
max-width: 600px;
}
.parent {
font-family: sans-serif;
width: 140px;
height: 100px;
border: 10px solid #349;
border-radius: 5px;
}
.example1,.example2,.example3 {
width: 100%;
height: 85px;
}
.example1 {
background: rgba(255,230,40,.8);
box-sizing: content-box;
}
.example2 {
box-sizing: content-box;
}
.example3 {
box-sizing: border-box;
}
.example2,.example3 {
border: solid rgba(255,.8) 10px;
padding: 5px;
}<body>
<div class="parent">
<div class="example1">
content-box<br>
border: none<br>
padding: none
</div>
</div>
<div class="parent">
<div class="example2">
content-box<br>
border: 10px<br>
padding: 5px
</div>
</div>
<div class="parent">
<div class="example3">
border-box<br>
border: 10px<br>
padding: 5px
</div>
</div>
</body>在您的情况下，您的行需要填充
undefined