2015-11-06 68 views
0

我与bootstrap css与自定义CSS重叠的问题。这是我的应用程序HTML呈现日期选择器,它使用引导CSS。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类引起引导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到我的日期选择器按钮。由于

回答

1

你应该试着改变你的自定义CSS类名(.btn)

0

那么,是什么,它听起来就像是你希望你的日期选择器以某种方式,但来自自举.btn CSS是做什么希望?如果您能够向该按钮添加课程,那么您可能需要使用!important来覆盖它。

例如:

.bootstrap-btn{background: pink; font-size: 20px; border: 3px solid white;} 

.my-new-btn{background: white !important; font-size: 24px !important; border: 2px solid green !important;} 

再次,这将是,如果你能在my-new-btn类添加到您的按钮。当我不能编辑通过脚本加载的类时,我不得不使用这种方法。