Blogger Information
Blog 12
fans 0
comment 0
visits 6079
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
HTML入门之表单操作知识小结
天空
Original
318 people have browsed it

登录表单

效果

系统登录效果图

代码

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. <title>系统登录</title>
  8. </head>
  9. <body>
  10. <form action="" method="post">
  11. <div>
  12. <label for="username">用户名:</label>
  13. <input type="text" id="username" name="user_name" value="admin" placeholder="请输入用户名称" autofocus required>
  14. </div>
  15. <div>
  16. <label for="pwd">密 码:</label>
  17. <input type="password" name="password" id="pwd" value="" placeholder="请输入密码" required>
  18. </div>
  19. <div>
  20. <label for="email">邮箱</label>
  21. <input type="email" name="email" id="email" value="" placeholder="请输入您的邮箱" required>
  22. </div>
  23. <div>
  24. <button>提交</button>
  25. </div>
  26. </form>
  27. </body>
  28. </html>

ifream写的简单的后台管理

效果

后台管理效果图

代码

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. <title>后台管理</title>
  8. </head>
  9. <body>
  10. <!-- 后台顶部 -->
  11. <div class="header">
  12. <H1>后台管理</H1>
  13. <div>
  14. <span>admin</span>
  15. <a href=""></a>退出
  16. </div>
  17. </div>
  18. <!-- 左侧导航栏 -->
  19. <url class="nav">
  20. <li><a href="demo1.html" target="content">菜单1</a></li>
  21. <li><a href="demo2.html" target="content">菜单2</a></li>
  22. <li><a href="demo3.html" target="content">菜单3</a></li>
  23. <li><a href="demo4.html" target="content">菜单4</a></li>
  24. <li><a href="demo5.html" target="content">菜单5</a></li>
  25. </url>
  26. <!-- 右侧内容区 -->
  27. <iframe src="" frameborder="2" name="content"></iframe>
  28. </body>
  29. </html>
Correcting teacher:PHPzPHPz

Correction status:qualified

Teacher's comments:
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post