html - CSS应用于特定类

Question

我遇到了 bootstrap CSS 与自定义 CSS 重叠的问题。这是我的呈现日期选择器的应用程序 html，它使用 Bootstrap css。

 <input type="text" class="datepicker-input" uib-datepicker-popup="{{format}}" ng-model="dt" is-open="status.opened" min-date="minDate" max-date="maxDate" datepicker-options="dateOptions" date-disabled="disabled(date, mode)" ng-required="true" close-text="Close" ng-click="open($event)" placeholder="Choose your date"/>

这是我定制的 .btn 类，它会导致 bootstrap btn 类出现问题。我无法删除此类或直接修改名称，因为许多其他页面使用此 btn 样式。

.btn {
    background-color: #b0b1a8;
    border-radius: 4px;
    border-width: 0;
    color: #fff;
    display: inline-block;
    font-weight: bold;
    font-size: 21px;
    font-size: 2.1rem;
    padding: 8px 20px;
    padding: 0.8rem 2rem;
    margin: 0;
    outline: none;
    text-align: center;
    -webkit-transition: background-color 100ms cubic-bezier(0.25, 0.1, 0.25, 1), border-color 100ms cubic-bezier(0.25, 0.1, 0.25, 1);
    -moz-transition: background-color 100ms cubic-bezier(0.25, 0.1, 0.25, 1), border-color 100ms cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: background-color 100ms cubic-bezier(0.25, 0.1, 0.25, 1), border-color 100ms cubic-bezier(0.25, 0.1, 0.25, 1);
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    white-space: nowrap
}

现在，我怎样才能欺骗上面的 css，而不是将它的 .btn 实现到我的日期选择器按钮。谢谢

Answer 1

您应该尝试更改您的自定义 css 类名 (.btn)