2017-08-17 43 views
-1

我同時做網頁設計和開發。我通常更喜歡編寫自己的CSS,不使用任何框架。在我的當前項目的客戶說我完成了設計,這將有助於他們的開發團隊,如果我還可以代碼生成的HTML CSS &。他們的要求是使用引導4.Bootstrap最佳實踐?

我說好,並開始工作。不過,在使用Bootstrap時,我有一些關於最佳實踐的問題。 例如,假設我想有一個需要左邊框具有一定的非主題顏色的.navbar文本。我的問題是:

  • 我應該創建一個新類本,或者只是覆蓋.navbar文本類?通常我會遵循BEM,併爲此創建一個新類,但我不確定在這種情況下這不會造成混淆。
  • 由於我已經爲邊框添加了CSS規則,我應該繼續在元素上添加Bootstrap實用工具類,還是應該只在新規則中添加CSS?說我想添加一些左填充,我應該添加pl-2類的元素,或者我應該添加填充左:0.5rem到我的CSS規則?

我想讓我的代碼儘可能簡單,讓他們的開發團隊能夠使用,而且我不知道如何繼續。任何意見,將不勝感激。

+0

通常我會創建新班級,例如btn btn-transparent-dark或編輯班級btn btn-primary,我用相同的班級名稱更改btn-primary顏色 – Ata

回答

2

我應該創建一個新類本,或者只是覆蓋 .navbar文本類?通常我跟隨BEM,並會創建一個新類 這一點,但我不知道這會不會在這個 情況混亂。

創建一個新類。重寫或者改變自舉類是一個沒有去,因爲如果他們最終升級爲引導的新版本,或VS本地託管的開始使用CDN(反之亦然)的東西將停止工作,它使用的方式,他們不會知道爲什麼。離開引導自舉,很容易讓一個新的開發者一起去,並沒有問題,「這是自舉,或舉其特定的味道」。

編輯:

爲了澄清,在你的例子的情況下,我會做一個實用工具類,並將其添加到的元素。所以在HTML你會class="navbar-text left-border"和我的CSS .navbar-text.left-border{border-left: 1px solid black;}而不是.navbar-text{border-left: 1px solid black !important;}

既然我已經增加了對邊境的CSS規則,我應該繼續 的元素添加引導工具類,還是應該我只是將 CSS添加到我的新規則中?假設我想添加一些左填充,我要補充的 PL-2級的元素,或者我應該添加填充左:0.5rem到 我的CSS規則?

將其添加到您現有的規則中。想想這樣:

假設你改變了主意,並且實際上不再需要這種填充,或者你想將其改變爲新的值。你願意改變它在你的CSS的一個地方,或者你在你的HTML中使用那個類的地方嗎?

+0

謝謝您的回答。關於這一點:_你是否想在你的css中的某個地方改變它,或者你在你的html中使用過這個類的所有地方?_是的,這也是我的看法,這是我通常編寫的方式,但我不確定是否這是「引導方式」。我的意思是,如果是這種情況,那麼爲什麼所有這些工具類的填充/邊距等首先呢? – Andreyu

+0

它們旨在用於您可以使用某些填充的類的單個實例但您不想創建全新類的情況。他們將它們包含在boostrap中的原因是,它們都是一致的,遵循一種模式('{property} {sides} - {size}'),而不是人們創建自己的超級冗長實用程序類('.padding-left-5px ') – Pat