[前端] HTML用户注册页面设置源码

1579 0
Honkers 2022-10-19 16:15:07 | 显示全部楼层 |阅读模式



设计上图中的网页:
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6.     <title>Document</title>
  7.     <style>
  8.             form{
  9.                 width: 800px;
  10.                 height: 700px;
  11.                 border: 1px solid red;
  12.                 margin: auto;
  13.                 background: url(images/tree.jpg) no-repeat -40px 300px;
  14.             }
  15.             form h3{
  16.                 margin-left: 200px;
  17.             }
  18.             p{
  19.                 margin-left: 200px;
  20.             }
  21.             hr{
  22.                 margin-left: 200px;
  23.             }
  24.              .a1{
  25.                  margin-left: 85px;
  26.              }
  27.              .a2{
  28.                 margin-left: 110px;
  29.             }
  30.             input,
  31.             textarea
  32.             {
  33.             background: url(images/attention.png) no-repeat right;
  34.             }
  35.             button{
  36.                 margin-left: 200px;
  37.                 background: rgb(81, 187, 125);
  38.                 color: white;
  39.             }
  40.             span#as:hover input{
  41.                 width: 300px;
  42.                 height: 40px;
  43.             }
  44.     </style>
  45. </head>
  46. <body>
  47.         <form action="">
  48.             <h3>用户注册:</h3>
  49.             <hr>
  50.             <p>用户昵称:<span class="a1" id="as"><input type="text" required placeholder autofocus></span> <hr></p>
  51.             <p>注册邮箱:<span class="a1" id="as"><input type="email" required placeholder="javin@example.com"></span><hr></p>
  52.             <p>密码: <span class="a2" id="as"><input type="password" required placeholder></span><hr></p>
  53.             <p>性别:<span class="a2">男<input type="radio" name="1" checked>
  54.                 女 <input type="radio" name="1"> </span><hr>
  55.              </p>
  56.              <p>年龄:<span class="a2" id="as"><input type="number" name="number1" required placeholder></span><hr></p>
  57.              <p>兴趣爱好:<span class="a1">
  58.                 足球<input type="checkbox" name="1">
  59.                 篮球<input type="checkbox" name="1">
  60.                 游泳<input type="checkbox" name="1">
  61.                 唱歌<input type="checkbox" name="1">
  62.                 跑步<input type="checkbox" name="1">
  63.                 瑜伽<input type="checkbox" name="1">
  64.              </span><hr></p>
  65.             <p>自我介绍: <span class="a1"><textarea name="abcde" cols="30" rows="10" required placeholder>Please enter your message</textarea></span><hr> </p>
  66.             <button type=submit>立即注册</button>
  67.             <div></div>
  68.         </form>
  69. </body>
  70. </html>
复制代码
到此这篇关于HTML用户注册页面设置源码的文章就介绍到这了,更多相关html用户注册页面内容请搜索中国红客联盟以前的文章或继续浏览下面的相关文章,希望大家以后多多支持中国红客联盟!

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有账号?立即注册

×
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

Honkers

特级红客

关注
  • 3155
    主题
  • 36
    粉丝
  • 0
    关注
这家伙很懒,什么都没留下!

中国红客联盟公众号

联系站长QQ:5520533

admin@chnhonker.com
Copyright © 2001-2025 Discuz Team. Powered by Discuz! X3.5 ( 粤ICP备13060014号 )|天天打卡 本站已运行