加粗下拉第一個值

-2

我必須將下拉文本中的第一個值設爲粗體。我嘗試使用ng-class屬性，因爲UI在angularjs中開發，但未獲得成功。現在，我正在嘗試css通過使用第一胎兒選擇器。我嘗試了以下風格。加粗下拉第一個值

1) 
select#ad-version-select.form-control : first-child { 
    font-weight: bold; 
} 

2) 
select#ad-version-select.form-control >: first-child { 
    font-weight: bold; 
}

但是上面的樣式。沒有工作。如果我使用

select#ad-version-select.form-control { 
      font-weight: bold; 
     }

所有值下拉越來越大膽。如何使下拉菜單中的第一個值僅顯示爲粗體？我不能使用javascript或jquery。請幫我css。

來源

2016-01-20 Sanjay

你嘗試過'選擇：第一個孩子'嗎？ – alex

嘗試過，但沒有成功。 – Sanjay

使用CSS時，選擇下拉菜單中的樣式選項的跨瀏覽器行爲如此不一致。例如，在Firefox中，可以在下拉菜單中使用粗體顯示項目，但是在Chrome瀏覽器中不可以，並且這包括optgroup。如果這些樣式很重要，而且您希望跨瀏覽器一致性，那麼您可以考慮使用div等自定義下拉菜單。 – Raevenk

嘗試這種方式

select#ad-version-select.form-control option:nth-child(1){ 
    font-weight:bold; 
}

來源

2016-01-20 10:22:13

試圖在鉻和Safari瀏覽器。但不工作。 – Sanjay

https://code.google.com/p/chromium/issues/detail?id=44917&q=select%20styling%20bold&colspec=ID%20Pri%20M%20Stars%20ReleaseBlock%20Cr%20Status%20Owner%20Summary%20OS%20Modified #makechanges –

是的。在Firefox中工作..！ – Sanjay

你應該嘗試像這個 -

select#ad-version-select.form-control option:first-child { 
 
    font-weight: bold; 
 
}

<select name="" id="ad-version-select" class="form-control"> 
 
    <option value="">option</option> 
 
    <option value="">option</option> 
 
    <option value="">option</option> 
 
    <option value="">option</option> 
 
</select>

來源

2016-01-20 10:24:39

我試過這個，但沒有運氣爲我的情況。 – Sanjay

在Chrome中似乎不適用於我。 – alex

-1

其實你不能大膽的選項。

唯一的方法來突出或加粗是使其成爲一個選項組

<select> 
    <optgroup label="Label Group"> 
     <option value="label value 1">Label 1</option> 
     <option value="Label value 2">Label 2</option> 
    </optgroup> 
    <optgroup label="Label Group 2"> 
     <option value="label value 3">Label 3</option> 
     <option value="label value 4">Label 4</option> 
    </optgroup> 
</select>

您可以嘗試在這裏W3Schools

來源

2016-01-20 10:40:19 Maqk

在這裏，我不能擁有組，因爲下拉菜單中的所有值都屬於單一類型。在下拉菜單中是不可能有一個大膽的值？ – Sanjay

默認情況下，該選項值不支持粗體字體粗體。但是你可以使用僞類來着色該值。 – Maqk

select#ad-version-select.form-control option:nth-child(1) { 
    font-weight: bold; 
}

將做的工作，但只適用於Firefox，而不是在谷歌鉻或在徒步旅行隊。

來源

2016-01-21 04:24:07 Sanjay

加粗下拉第一個值

回答

相關問題