HTML登錄頁面代碼有窗口
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>登錄</title> <style> * { margin: 0; padding: 0; } body { background: #f0f0f0; } form { width: 500px; height: 300px; background: #fff; border: 1px solid #ccc; margin: 100px auto; padding-top: 50px; padding-left: 50px; box-shadow: 0 0 20px rgba(0, 0, 0, .2); } input[type="text"], input[type="password"]{ border: none; border-bottom: 2px solid #ccc; width: 300px; height: 30px; outline: none; font-size: 16px; margin-bottom: 20px; padding: 0 10px; } input[type="submit"] { width: 120px; height: 40px; background: #3498db; color: #fff; border: none; font-size: 18px; margin-top: 20px; margin-left: 50px; border-radius: 5px; cursor: pointer; } </style> </head> <body> <form> <h2>登錄</h2> <input type="text" placeholder="用戶名"><br> <input type="password" placeholder="密碼"><br> <input type="submit" value="提交"> </form> </body> </html>
以上是一個簡單的HTML登錄頁面代碼實現,主要通過form標簽及其內部的input標簽來實現窗口、用戶名、密碼和提交按鈕。在樣式方面,主要使用了CSS來設置窗口的寬度、高度、邊框、陰影、背景等,以及輸入框的邊框、寬度、高度、字體大小等。同時,還設置了登錄按鈕的顏色、邊框、字體大小等屬性。這樣可以讓登錄頁面更具有可讀性和可操作性。