HTML 实操试题(一)

  1. 创建一个包含标题、段落和链接的基本HTML文档:

    html 复制代码
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>HTML Practice</title>
    </head>
    <body>
        <h1>Welcome to My Website</h1>
        <p>This is a sample paragraph. <a href="https://www.example.com">Visit our website</a>.</p>
    </body>
    </html>
  2. 创建一个无序列表和有序列表:

    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>
  3. 创建一个表格展示学生信息:

    html 复制代码
    <table border="1">
        <thead>
            <tr>
                <th>Name</th>
                <th>Age</th>
                <th>Grade</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>John Doe</td>
                <td>20</td>
                <td>A</td>
            </tr>
            <tr>
                <td>Jane Smith</td>
                <td>22</td>
                <td>B</td>
            </tr>
        </tbody>
    </table>
  4. 使用表单元素创建一个简单的登录表单:

    html 复制代码
    <form>
        <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="Login">
    </form>
  5. 嵌套使用div元素创建一个基本页面布局:

    html 复制代码
    <div class="header">
        <h2>My Website</h2>
    </div>
    
    <div class="nav">
        <ul>
            <li>Home</li>
            <li>About</li>
            <li>Contact</li>
        </ul>
    </div>
    
    <div class="content">
        <p>This is the main content of the page.</p>
    </div>
    
    <div class="footer">
        <p>&copy; 2023 My Website</p>
    </div>
相关推荐
2501_915918411 小时前
Web 前端可视化开发工具对比 低代码平台、可视化搭建工具、前端可视化编辑器与在线可视化开发环境的实战分析
前端·低代码·ios·小程序·uni-app·编辑器·iphone
程序员的世界你不懂2 小时前
【Flask】测试平台开发,新增说明书编写和展示功能 第二十三篇
java·前端·数据库
索迪迈科技2 小时前
网络请求库——Axios库深度解析
前端·网络·vue.js·北京百思可瑞教育·百思可瑞教育
gnip2 小时前
JavaScript二叉树相关概念
前端
rannn_1112 小时前
【Javaweb学习|实训总结|Week1】html基础,CSS(选择器、常用样式、盒子模型、弹性盒布局、CSS定位、动画),js(基本类型、运算符典例)
css·笔记·学习·html
一朵梨花压海棠go2 小时前
html+js实现表格本地筛选
开发语言·javascript·html·ecmascript
attitude.x3 小时前
PyTorch 动态图的灵活性与实用技巧
前端·人工智能·深度学习
β添砖java3 小时前
CSS3核心技术
前端·css·css3
空山新雨(大队长)3 小时前
HTML第八课:HTML4和HTML5的区别
前端·html·html5