今天我們來(lái)看一下163郵箱登錄界面的html代碼:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>163郵箱登錄</title> <link rel="stylesheet" href="css/login.css"> </head> <body> <div id="loginBox"> <div class="logo"> <img src="images/logo.png" alt="163郵箱logo"> </div> <div class="login"> <form id="loginForm" name="loginForm" method="post" action="#"> <div class="email"> <input type="text" id="email" name="email" placeholder="請(qǐng)輸入郵箱"/> </div> <div class="password"> <input type="password" id="password" name="password" placeholder="請(qǐng)輸入密碼"/> </div> <div class="remember"> <input type="checkbox" id="remember" name="remember"/><label for="remember">記住我</label> </div> <div class="submit"> <input type="submit" id="submit" value="登 錄"/> </div> </form> </div> <div class="reg"> <a href="#">立即注冊(cè)</a><a href="#">找回密碼</a> </div> </div> </body> </html>
我們可以看到,該頁(yè)面使用了一個(gè)div容器包裹整個(gè)登錄界面,并分成了logo、登錄、注冊(cè)三個(gè)部分。其中form表單的method屬性為post,action屬性為“#”,表示提交到當(dāng)前頁(yè)面。
在樣式方面,該頁(yè)面使用了一個(gè)名為“l(fā)ogin.css”的樣式表,其中定義了輸入框、按鈕等元素的樣式。
總的來(lái)說,該頁(yè)面的html代碼結(jié)構(gòu)清晰,語(yǔ)義明確,適合作為實(shí)際項(xiàng)目的參考。