用css

Question

在一個標準的HTML頁面，我知道如何改變輸入的外觀變化領域的在軌外觀，但在軌道上我投入的構成就像

<div class="field"> 
    <%= f.label :name %><br/> 
    <span style="color:red;font-weight: normal; font-size:11px; "><%= errors_for(:name, @user) %> </span> 
    <%= f.text_field :name %>  
</div> 

他們像瀏覽器中顯示正常的領域。如何使用CSS來使它看起來像在這頁http://kb.worldsecuresystems.com/tutorials/的頂部的搜索欄（略顯圓潤的邊緣，1px的＃999中風，尺寸較大）謝謝

Answer 1

您將需要應用CSS實際<input>

.field input { 
    color: #999; 
    font-weight: bold; 
    font-size: 24px; 
    padding: 10px; 
    border: 2px solid #999; 
    border-radius:2px; 
} 

See it on jsFiddle