在中國傳統文化中,有十二生肖的概念,分別為鼠、牛、虎、兔、龍、蛇、馬、羊、猴、雞、狗、豬。這些生肖在中國人的生活中具有非常重要的地位。那么,讓我們寫一個 HTML 靜態投票代碼,來讓用戶投上自己喜歡的生肖吧!
<html> <head> <title>十二生肖投票</title> </head> <body> <h1>請選擇您喜歡的生肖</h1> <form> <fieldset> <legend>生肖列表</legend> <p> <input type="radio" name="zodiac" value="1"> <label>鼠</label> </p> <p> <input type="radio" name="zodiac" value="2"> <label>牛</label> </p> <p> <input type="radio" name="zodiac" value="3"> <label>虎</label> </p> <p> <input type="radio" name="zodiac" value="4"> <label>兔</label> </p> <p> <input type="radio" name="zodiac" value="5"> <label>龍</label> </p> <p> <input type="radio" name="zodiac" value="6"> <label>蛇</label> </p> <p> <input type="radio" name="zodiac" value="7"> <label>馬</label> </p> <p> <input type="radio" name="zodiac" value="8"> <label>羊</label> </p> <p> <input type="radio" name="zodiac" value="9"> <label>猴</label> </p> <p> <input type="radio" name="zodiac" value="10"> <label>雞</label> </p> <p> <input type="radio" name="zodiac" value="11"> <label>狗</label> </p> <p> <input type="radio" name="zodiac" value="12"> <label>豬</label> </p> </fieldset> <button type="submit">提交</button> </form> </body> </html>
以上代碼中,我們使用了 radio 類型的表單,將十二生肖列出,并用 label 標簽來描述每個選項,讓用戶更好的理解。每個 radio 標簽的 name 屬性均為 "zodiac",這意味著用戶只能選擇一個選項。當用戶點擊提交按鈕時,將會提交對應的數據。
上一篇用css畫一個矩形
下一篇docker112安全