2014-12-19 90 views
2

我創建了傳送帶,我需要覆蓋樣式指標按鈕。我有風情:如何覆蓋引導樣式

.carousel-indicators { 
    position: absolute; 
    bottom: 10px; 
    left: 50%; 
    z-index: 1; 
    width: 60%; 
    padding-left: 0; 
    margin-left: -30%; 
    text-align: center; 
    list-style: none; 
    display: inline-block; 
} 

,並需要得到:

.carousel-indicators { 
    z-index: 1; 
    padding-left: 0; 
    list-style: none; 
    display: inline-block; 
} 

如何重寫樣式或刪除默認?

回答

2

你的意思是它的默認CSS的樣式?

.carousel-indicators { 
    z-index: 1; 
    padding-left: 0; 
    list-style: none; 
    display: inline-block; 
    /*lets override other properties*/ 
    position: static;/*or relative*/ 
    width: auto; 
    margin: 0; 
    text-align: left; 
} 

頂部,左不需要,因爲它是使用靜態的立場不會感知到用於您正在使用哪個版本的引導者

0

修改?

如果是CSS版本,只需使用更具體的選擇器編寫您的樣式。例如:

#your-carousel .carousel-indicators { 
    /* your styles*/ 
} 

如果使用引導程序(我總是建議選項)的LESS版本,你可以很容易地改變它在carousel.less文件和編譯的CSS版本。

+0

Bootstrap v3.3.1。無論如何,我試過裝bootstrap的樣式。 – 2014-12-19 08:27:57

+0

好的,但是我的意思是它已經編譯好了,並且已經把鏈接指向了CSSversion(例如來自CDN),或者你有本地的.less版本,並且在每次更改之後將它編譯爲CSS。 – 2014-12-19 08:51:55

0

您還應該留意腳本的加載順序,以使所有內容正常工作。如果您覆蓋CSS,則重寫的代碼應該最後加載。同樣有趣的是利用重要:

.exampleClass { 
    margin: 0 !important; 
} 
.exampleClass { 
    margin: 5px; 
} 

第一個將覆蓋第二個,這樣.exampleClass將有0保證金因爲重要的是你可以告訴大家,這個指令具有較高權重的瀏覽器!比其他人。但請記住,當您將重要語句乘法時,CSS將使用代碼的邏輯加載順序,因爲在這種情況下,瀏覽器無法知道哪個比另一個更重要。