首页 > 其他 > 详细

027 H5常用标签

时间:2019-07-10 00:55:02      阅读:111      评论:0      收藏:0      [点我收藏+]

  只记录一下比较有趣的知识点。

一:新标签

1.选项列表datalist

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Document</title>
 6 </head>
 7 <body>
 8     <input type="text" list="sg">
 9     <datalist id="sg">
10         <option value="apple">苹果</option>
11         <option value="banna">香蕉</option>
12     </datalist>
13 </body>
14 </html>

 

2.效果

  技术分享图片

 

3.元素分类fieldset

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Document</title>
 6 </head>
 7 <body>
 8     <fieldset>
 9         <legend>用户登录</legend>
10         用户:<input type="text"><br>
11         密码:<input type="password">
12     </fieldset>
13 </body>
14 </html>

 

4.效果

  技术分享图片

 

二:表单属性

1.placeholder

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Document</title>
 6 </head>
 7 <body>
 8     用户名:<input type="text" placeholder="请输入">
 9 </body>
10 </html>

 

2.效果

  技术分享图片

 

3.autofocus

  自动对焦

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Document</title>
 6 </head>
 7 <body>
 8     用户名:<input type="text" placeholder="请输入" autofocus="autofocus">
 9 </body>
10 </html>

 

4.效果

  技术分享图片

 

5.multiple多选

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Document</title>
 6 </head>
 7 <body>
 8     上传:<input type="file" multiple>
 9 </body>
10 </html>

 

6.

 

  

 

  

027 H5常用标签

原文:https://www.cnblogs.com/juncaoit/p/11161297.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!