缺少明顯的東西，CSS沒有得到正確渲染

出於某種原因，我嘗試使用Twitter's Bootstrap製作一個簡單的HTML，但在我身邊破了一些東西，我無法弄清楚什麼是錯的。我提出了一個jsFiddle頁面是here，並附上了截圖。這些問題是：缺少明顯的東西，CSS沒有得到正確渲染

我好像不頂明白我錯過了什麼步驟。這裏很晚，我可能會用另一隻眼睛。有人可以告訴我，如果我失去了明顯的東西嗎？按鈕的風格，所以我不知道發生了什麼。

enter image description here

2011-08-21 Legend

你可以用CSS一點點實現這一目標。

將輸入和標籤浮動到左側，然後添加一點餘量。

label,input 
{ 
    float:left; 
    margin-bottom:5px; 
} 
label{ 
    clear:left; 
    width:50px; 
}

另外請注意，這部分是無效的HTML：

<input id="enableTooltip" type="checkbox">Enable tooltip </input>

你只需要進行文本標籤就像你與其他文本字段。輸入在HTML中沒有結束標記。

UPDATE

在你的HTML仔細看看後，它看起來像你忘了把你的表單字段的形式。

輸入始終需要進入<form>[...]</form>。

這裏與表單標籤再次是你的代碼包括：http://jsfiddle.net/Lrczj/2/

2011-08-21 09:28:33

+1謝謝。老實說，我不知道我們需要添加我們自己的CSS，使它看起來像Bootstrap頁面上的那些。那麼這是否意味着，我需要添加自己的陰影效果來模仿文本框的外觀？和下拉？抱歉!我只是有點困惑，因爲我認爲這是內置Bootstrap。 – Legend

也許你沒有。我不熟悉twitter bootstrap，但我現在快速瀏覽一下。 –

查看我的更新@傳奇。 –

您的jsfiddle並沒有真正像你截圖給我嗎？
我看了一下您的標記，並發現了一個錯誤：

<input id="enableTooltip" type="checkbox">Enable tooltip </input>

你不能把文字變成這樣的輸入。您需要將其更改爲：

<input id="enableTooltip" type="checkbox" />Enable tooltip

或：

<input id="enableTooltip" type="checkbox"><label>Enable tooltip</label>

2011-08-21 09:33:12 Gareth

+1好抓！我修正了這個部分的問題。是的，不一致......我只注意到它！截圖後我必須更新我的代碼。 – Legend

回答