2016-09-18 52 views
-2

請告訴我如何得到像這樣的輸入。如何在html中輸入樣式

Below is a picture

還提供了與解釋作出正確的選擇,當如何改變其顏色的代碼。 其實我嘗試了無線電輸入,但它不具吸引力,所以我需要一個代碼,通過它我可以使輸入具有吸引力,如上圖所示。我正在開發一個測驗遊戲,我需要這個代碼。請幫幫我 !!!!!

+2

你做了到現在什麼碼? – Aravind

+0

歡迎來到SO。請訪問[幫助],看看爲什麼這個問題是脫離主題。建議:發佈工作量和代碼,而不是要求我們爲您編寫代碼 – mplungjan

+0

這是您的手機中的一張照片嗎? –

回答

1

body { 
 
    margin: 0 auto; 
 
    background: #4B57E1; 
 
    line-height: 1.5em; 
 
    } 
 
nav { 
 
    width: 100%; 
 
    height: auto; 
 
    margin: 25px auto; 
 
    } 
 
ul { 
 
    margin: 0 30px; 
 
    padding: 0; 
 
    } 
 
ul li { 
 
    list-style: none; 
 
    display: block; 
 
    margin-bottom: 10px; 
 
    width: 250px; 
 
    } 
 
ul li a { 
 
    display: block; 
 
    padding: 10px 10px; 
 
    color: #7886A0; 
 
    background: #E8FDFE; 
 
    font-size: 16px; 
 
    font-family: "Arial"; 
 
    font-weight: bold; 
 
    text-transform: uppercase; 
 
    text-align: center; 
 
    text-decoration: none; 
 
    }
<html> 
 
    <body> 
 
    <nav> 
 
     <ul> 
 
     <li><a href="">top</a></li> 
 
     <li><a href="">right</a></li> 
 
     <li><a href="">bottom</a></li> 
 
     <li><a href="">left</a></li> 
 
     </ul> 
 
     </nav> 
 
    </body> 
 
    </html>

+0

圓角怎麼樣? –

+0

使用:ul li a {border-radius:5px;} – hamidrun