在選擇HTML選擇標記中設置兩個不同元素

在我的PHP代碼中，我從數據庫中拉出兩列的表格，並在下拉列表中顯示它們。以下是代碼片段：在選擇HTML選擇標記中設置兩個不同元素

echo "<select id='isv' class='required'>"; 
while($row = pg_fetch_row($result)){  
    echo "<option><span class='options'>" . $row[0] . "</span>&nbsp;" . $row[1] . "</option>"; 
} 
echo "</select><br>";

我想通過不同的樣式將它們分開。所以我寫了下面的CSS：

.options 
{ 
    color: red; 
    float: left; 
    text-align: right; 
    width: 15em; 
    margin-right: 1em; 
}

但是，樣式不適用於選項。我在這段代碼中需要更改什麼？

來源

2012-07-03 Rahul Desai

如果你使用的是Firefox，一個非常方便的插件是Firebug。 – Don

你不能在一個選項標籤中有標記 – Musa

只是一個頭，但[this related]（http://stackoverflow.com/questions/3354979/styling-part-of-the-option-text?rq=1 ）將表明這種樣式的平臺依賴。 – jedwards

<option>元素不能用這種方式設計，你必須使用JavaScript來設計你自己的實現。下拉菜單（<select> s）大多由瀏覽器鑲邊而不是CSS來設計。另外，<option>元素可能沒有任何子元素。

這裏是你可以通過CSS樣式一個很好的參考：http://bavotasan.com/2011/style-select-box-using-only-css/

來源

2012-07-03 18:46:25 Cecchi

~~您可以做出明智的利用 margin爲代替 <span>。（這是行不通的，不用說）~~

考慮使用一些jQuery插件來實現自定義下拉菜單。請參閱示例here。而且這個答案也是這個SO question。

來源

2012-07-03 18:52:20

我該怎麼做？ –

似乎很容易，當你有一個圖像與元素。儘管我有兩個元素。 –

在選擇HTML選擇標記中設置兩個不同元素

回答

相關問題