我在项目中使用bootstrap-vue，并且在使用响应式网格。我对不同的视点使用了不同的列大小。我在将背景，边框半径和阴影阴影添加到<footer id="footer" class="main-footer clearfix">
<p class="Copyright clearfix">
S © 2020
</p>
<h1 class="Social clearfix">
<a href="https://instagram.com"> <i class="fab fa-instagram"></i> </a>
</h1>
<ul class="footer-nav clearfix">
<li><a href="/Impressum/Impressum.html">Impressum</a></li>
<li><a href="/Datenschutz/Datenschutz.html">Datenschutz</a></li>
<li><a href="/AGB/AGB.html">AGB</a></li>
</ul>
</footer>的内容时遇到问题，因为<b-row>的宽度大于所有列的宽度。因此，我为每列添加背景，并且其工作正常（我不确定这样做的正确方法）。我使用相同的方法添加边框半径。它的工作正常，直到cols在小型设备中相互堆叠。我无法使盒装阴影适用于任何设备尺寸。有什么办法可以将内容包装在<b-row>内，并在包装器中添加border-radius和box-shadow以及背景。
示例https://codesandbox.io/s/intelligent-goldstine-wwpng?file=/src/components/HelloWorld.vue
答案 0 :(得分：0)
您需要使用<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="container" id="con">
<br />
<div class="form-group row">
الدولة: @Html.DropDownList("StateId", (SelectList)ViewBag.StateId, "اختر الدولة", htmlAttributes: new { @class = "form-control mx-2 col-md-2", id = "State" })
المدينة:@Html.DropDownList("CityName", new SelectList(string.Empty, "Value", "Text"), htmlAttributes: new { @class = "form-control col-md-2", id = "city" })
فصيلة الدم:@Html.DropDownList("blt", new SelectList(new[] { "+A", "-A", "+B", "-B", "+AB", "-AB", "+O", "-O" }), "اختر فصيلة الدم", new { @class = "form-control col-md-2 mr-md-3", id = "bt" })
<input type="submit" value="Search" class="btn btn-info col-md-1 mr-1" id="btn1" />
<input type="submit" value=" بحث" class="btn btn-info col-md-1" id="btnAllUser" />
</div>
</div>
<div id="UpdatePanel">
</div>来解决问题。并且我建议避免使用内联样式。