本章练习题：

最新推荐文章于 2025-03-20 21:07:50 发布

原创最新推荐文章于 2025-03-20 21:07:50 发布 · 130 阅读

0 ·

CC 4.0 BY-SA版权

前端学习专栏收录该内容

45 篇文章

订阅专栏

此博客展示了HTML的基本表单元素，包括文本输入、密码输入、选择列表、复选框、单选按钮和文本区域，还涉及了电子邮件验证和文件上传功能。用户可以输入昵称、密码和邮箱，选择邮箱提供商，指定性别，并通过复选框选择兴趣爱好。此外，用户还可以填写个人简介并上传个人照片。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
    <form method="post">
        昵称：<input type="text" />   <br>
        密码：<input type="text" />   <br>
        邮箱：<input type="text" />  
        
        <select>
            <option>qq.com</option>
            <option>sina.com</option>
            <option>jQuery</option>
            <option>JavaScript</option>
        </select>
        <br>
        性别:
        <input type="radio" name="gender" value="男" checked />男
        <input type="radio" name="gender" value="女" />女
        <br>
        爱好：
        <input type="checkbox" name="fruit" value="苹果"/>旅行
        <input type="checkbox" name="fruit" value="香蕉"/>摄影
        <input type="checkbox" name="fruit" value="西瓜"/>运动
       <br/>
        个人简介：<br/>
        <textarea rows="5" cols="20"></textarea>
        <br/>
        上传个人照片：
          <input type="file"/>
    </form>
</body>
</html>

运行效果：

在这里插入图片描述