Bootstrap 设置 DIV 边框半径

我的项目使用引导程序进行设计。我想将 BORDER RADIUS:25px !important 应用到我的 MAIN DIV:- 滚动组 div。

当我将 BORDER RADIUS:25px !important 应用于 row text-center flex-nowrap 时,它基本上将半径应用于所有子 div 但是,最终我我有兴趣将半径应用于 MAIN DIV。请提出建议。

<div class="container scroll-group">
<div class="row text-center flex-nowrap">
<div class="col-sm-12 text-left text-white" style="padding-top: 10px; padding-bottom:10px; background-color:midnightblue">

<div class="chips-headers font-weight-bold">TITLE</div>
</div>
</div>
<div class="row text-center flex-nowrap">
@{
foreach(LIST)
{
<div class="col-sm-4" style="padding-top: 10px; padding-bottom:10px; background-color:midnightblue">
<!-- Horizontal Card Layout for Canon Product -->
<div tabindex="0" class="e-card e-card-horizontal" id="id">
<a asp-area="" asp-controller="" asp-action="" asp-route-rowId="" asp-route-section="">
<img src='@' style="height:190px" />
</a>
                                            
<div class='e-card-stacked' style="padding-bottom: 5px;">
<a asp-area="" asp-controller="" asp-action="" asp-route-rowId="" asp-route-section="">
<div class="e-card-header">
<div class="e-card-header-caption">
<div class="e-card-header-title font-weight-bold text-wrap card-header-custom">TEXT</div>
</div>
</div>
<div class="e-card-content" style="height: 146px">
TEXT
<br />
<br />
TEXT
</div>
</a>
<div class="e-card-footer ">
<div class="pull-right">
<button id="btnPlay" type="button" onclick="" data-toggle="modal" data-target="" class="btn video-btn mr-3 d-flex justify-content-center align-items-center">
<img src="IMAGE1.jpeg" class="" height="30">
</button>
</div>
</div>
</div>
</div>
</div>
}
}
</div>
</div>

此处为样式代码

.scroll-group > .row {
        overflow-x: auto;
        white-space: nowrap;
}
.scroll-group > .row > .col-sm-4 {
            display: inline-block;
            float: none;
}
.container {
            position: relative;
}
xinandjsl0305 回答:Bootstrap 设置 DIV 边框半径

暂时没有好的解决方案,如果你有好的解决方案,请发邮件至:iooj@foxmail.com
本文链接:https://www.f2er.com/24397.html

大家都在问