jquery ui標籤主要風格變化

我正在使用jquery UI選項卡，我需要主要更改它的樣式。我需要放棄背景圖像，邊界，幾乎所有東西。我需要它看起來很小，而不是像它自成一體。jquery ui標籤主要風格變化

這樣做的最好方法是什麼？但是，我需要爲日曆小部件使用默認的UI樣式，它位於同一頁面上。我做了大量的研究，每個人似乎都指向了主題滾輪。但是，我不只是想改變顏色和邊框半徑。我需要刪除垃圾。主題輥似乎只是改變顏色的東西（對真實世界並不真正有用）。如何在不改變同一頁面上其他UI小部件樣式的情況下調整標籤的CSS（我希望日曆保持原樣）？

它甚至值得使用jQuery UI的我的標籤？

來源

2010-03-17 Jonah

無法回答問題的最後部分。這是你必須自己決定的事情。其餘的很容易。只適應CSS。 – jitter 2010-03-17 01:06:54

如何在不改變日曆樣式的情況下調整標籤的CSS？ – Jonah 2010-03-17 01:22:24

你應該看看Keith Wood在上的詳細博客文章，樣式JQuery UI標籤。

回答你的具體問題

我需要rempve背景圖像，邊框，幾乎所有的東西。我需要它看起來不明顯

是基思·伍德的帖子的這部分「Remove most of the formatting」。

除此之外，還有10個更多的風格變化，完成所需的CSS以達到預期的效果。

JQuery UI Tabs Styling - Keith Wood Blog Post

來源

2012-03-26 07:21:31 Shiva

它應該是相當簡單的CSS。你的元素上有ID和類，你可以用CSS來觸摸它們。 Themeroller只是一個快捷的事情。

如果我回想起來，還可以調整標籤js並調整添加圖像的線條（如果這是同一個插件），或者完全按照您的喜好去除該線條。

來源

2010-03-17 01:25:44 Kevin

我選擇編寫自己的簡單標籤功能時，我意識到我不需要大部分內置功能，例如加載AJAX內容和動態添加/刪除標籤。如果我需要這些功能，自己實現它們將很容易。是什麼促使我拋棄jQuery UI Tabs，是因爲我必須以不同的方式構建我的DOM元素。我還需要讓我的標籤看起來很小，我認爲從頭開始構建會比試圖剝離很少。

我最想錯過的特性是jQuery UI Tabs如何自動選擇由URL中的＃表示的選項卡（我知道我可以複製它 - 只是還沒有得到它）。

UPDATE：但是，是的，如果你堅持它，你可以使用任何標識覆蓋CSS您有：

#my-tabs .ui-state-default { 
    background-image: none; /* remove default bg image */ 
}

等..

來源

2010-03-17 01:26:05

這似乎是一條很好的路線。有沒有辦法阻止jquery向widget中添加類，以便我可以從頭開始編寫樣式？ – Jonah 2010-03-17 02:18:20

嘗試以下在你的CSS假設你的課是.mytabs的重寫CSS。它應該讓你開始

.mytabs li { 
     background : white !important; 
     border-top: 0 !important; 
     border-left: 0 !important; 
     border-right: 0 !important; 

    } 
    .mytabs li.ui-state-active { 
     background : white !important; 
     border-top: 0 !important; 
     border-left: 0 !important; 
     border-right: 0 !important; 
     margin: 0; 


    } 

.mytabs li a 
    { 
     color:   Black !important; 
     font-size:  1.4em !important; 
     font-weight: bolder; 
     padding:  4px 1.5ex 3px !important; 
    }

來源

2010-03-17 02:19:37 kiev

一些CSS很容易，你可以輕鬆地覆蓋jQuery UI提供的標準CSS。如果修改後的CSS出現在jQuery UI CSS之後，您可能不需要！重要。

你也可以在加載時使用jQuery刪除/添加類到每個元素，但這似乎有點不必要。

來源

2010-03-18 13:29:55

我不知道！重要的屬性應該在默認的jQuery UI模板中放在第一位。例如，如果將選項卡更改爲左側或右側而不是頂部，則'border-bottom'不應該有！important，因爲這通常會被覆蓋。

來源

2010-05-17 09:31:15 user339047

幾乎一切都是這裏所涉及，但我環顧四周，發現了一種折騰的東西，你真的不需要很容易用一個單獨的類，然後同時編輯剩餘的屬性。

*[class*="ui-"] { 
    border-radius:0; 
    background-image: none; 
    . 
    . 
    . 
}

這樣你選擇所有以「用戶界面 - 」啓動類，並刪除任何你想從jQuery UI的刪除。

來源

2014-02-05 18:30:29

#my-tabs * { 
    background-image: transparent; 
}

來源

2014-10-01 17:37:56 Bellash

提供某種解釋和任何代碼總是有幫助的。 – 2014-10-01 18:13:53

jquery ui標籤主要風格變化

回答

相關問題