html5 - 3.22综合案例03

顺晟科技

2022-09-15 19:58:06

html5--3.22 综合实例03

学习要点

通过一个综合实例来回顾学过的内容

这一章的内容比较多，不必强求一下子全记住，多做一些练习，用得多了自然就可以记住了
可以自己找一些实例练练手，比如各网站的注册表，调查表之类的，自己仿照着做做练习
综合实例要用到一些我们即将要将的CSS知识，暂时了解即可，等学过了CSS可以回过头来自己再完善这个案例

实例

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Document</title>
 6     <style type="text/css">
 7         form{width: 400px;background: #9370D8;padding: 10px;margin-top: 150px;margin-left: 300px;}
 8         button{background: #808080;padding: 8px;border-radius: 5px;}
 9         button:hover{padding: 10px;background: #2F4F4F;border-radius: 5px;}
10         input{padding: 8px;background: #F8F8F8}
11         input:focus{padding: 8px;background: #FFC0CB}
12     </style>
13 </head>
14 <body>
15     <form action="L3_01.html" method="get">
16     <fieldset>
17     <legend>注册用户</legend>
18         <p><label for="name">账号：</label><input type="text" name="name" id="name" required="" placeholder="账号"></p>
19         <p><label for="password">密码：</label><input type="password" name="password" id="password"  placeholder="密码"></p>
20         <p><label for="tel">电话号码：</label><input type="tel" name="tel" id="tel"  placeholder="电话号码"></p>
21         <p><label for="email">电子邮箱：</label><input type="email" name="email" id="email"  placeholder="电子邮箱"></p>
22         <!-- <input type="submit" value="确定"> -->
23         <button>注册用户</button>
24     </fieldset>
25         
26     </form>
27 </body>
28 </html>

View Code

上一篇：[html]js打开指定页面下一篇：生成html页面（转） - 夜半花开

网站建设

Html

html5 - 3.22综合案例03

html5--3.22 综合实例03

学习要点

实例