HTML5動態登錄界面代碼
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>動態登錄界面</title> <style> #login-form { width: 300px; margin: 0 auto; padding: 20px; background-color: #ffffff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); } #username, #password { display: block; width: 100%; padding: 10px; margin-bottom: 10px; border: none; border-radius: 3px; box-sizing: border-box; } #submit { display: block; width: 100%; padding: 10px; background-color: #4caf50; color: #ffffff; border: none; border-radius: 3px; text-align: center; font-size: 16px; cursor: pointer; } </style> </head> <body> <form id="login-form"> <label for="username">用戶名:</label> <input type="text" id="username" name="username" placeholder="請輸入用戶名"> <label for="password">密碼:</label> <input type="password" id="password" name="password" placeholder="請輸入密碼"> <input type="submit" id="submit" value="登錄"> </form> </body> </html>
以上是一個簡單的HTML5動態登錄界面代碼示例,包含表單、輸入框和按鈕,并使用CSS樣式進行美化,能夠實現基本的登錄功能。
上一篇下載css 圖片
下一篇下拉菜單div css