html网页设计代码大全

HTML是用于创建网页的标记语言。

html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Your Page Title</title> <style> /* 添加样式表代码可以放在这里 */ body { font-family: Arial, sans-serif; margin: 0; padding: 0; background-color: #f4f4f4; } header { background-color: #333; color: #fff; padding: 10px; text-align: center; } main { padding: 20px; } footer { background-color: #333; color: #fff; padding: 10px; text-align: center; } </style> </head> <body> <header> <h1>Your Website Name</h1> </header> <main> <h2>Welcome to Your Website!</h2> <p>This is a sample HTML template. Modify it according to your needs.</p> </main> <footer> <p>&copy; 2024 Your Website. All rights reserved.</p> </footer> </body> </html>

这是一个基本的 HTML 结构,包括文档声明、头部、主体,以及一些简单的内联 CSS 样式。你可以根据自己的需求添加更多的 HTML 元素和样式。

html
<a href="https://www.example.com" target="_blank">Visit Example.com</a>

图像:

html
<img src="image.jpg" alt="Description of the image">

列表:

html
<ul> <li>Item 1</li> <li>Item 2</li> <li>Item 3</li> </ul> <ol> <li>First</li> <li>Second</li> <li>Third</li> </ol>

表格:

html
<table> <thead> <tr> <th>Header 1</th> <th>Header 2</th> </tr> </thead> <tbody> <tr> <td>Row 1, Cell 1</td> <td>Row 1, Cell 2</td> </tr> <tr> <td>Row 2, Cell 1</td> <td>Row 2, Cell 2</td> </tr> </tbody> </table>

表单:

html
<form action="/submit" method="post"> <label for="username">Username:</label> <input type="text" id="username" name="username" required> <label for="password">Password:</label> <input type="password" id="password" name="password" required> <input type="submit" value="Submit"> </form>

嵌入视频:

html
<iframe width="560" height="315" src="https://www.youtube.com/embed/example" frameborder="0" allowfullscreen></iframe>

JavaScript 代码:

html
<script> // Your JavaScript code goes here function showAlert() { alert('Hello, this is an alert!'); } </script>