下面是一個基于HTML5的手機注冊頁面的代碼示例:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>手機注冊</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet"> <style> body { font-family: 'Roboto', sans-serif; background-color: #f1f1f1; } .container { max-width: 400px; margin: 0 auto; background-color: #ffffff; padding: 20px; border-radius: 10px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); } h1 { text-align: center; margin-bottom: 20px; } input[type=text], input[type=password] { width: 100%; padding: 10px; margin: 8px 0; display: inline-block; border: 1px solid #ccc; box-sizing: border-box; border-radius: 5px; } button { background-color: #4CAF50; color: white; padding: 10px 20px; border: none; border-radius: 5px; cursor: pointer; width: 100%; margin-top: 10px; } button:hover { background-color: #45a049; } </style> </head> <body> <div class="container"> <h1>手機注冊</h1> <form action="#" method="post"> <p><label for="username">用戶名:</label><br /><input type="text" name="username" id="username" required></p> <p><label for="password">密碼:</label><br /><input type="password" name="password" id="password" required></p> <p><label for="email">郵箱:</label><br /><input type="text" name="email" id="email" required></p> <p><button type="submit">注冊</button></p> </form> </div> </body> </html>以上代碼定義了一個基本的HTML5頁面,它包含一個標題、一個表單和一些基本的樣式。這個表單提供了一個用戶名、密碼和電子郵件地址的輸入字段,以及一個注冊按鈕。當用戶填寫了所有必填字段并點擊注冊按鈕時,頁面會根據表單的action屬性和method屬性將表單數(shù)據發(fā)送到服務器上進行處理。在本例中,action屬性被設置為"#",也就是發(fā)送數(shù)據到當前頁面,而method屬性被設置為"post",表示使用HTTP POST請求來發(fā)送數(shù)據。