专注收集记录技术开发学习笔记、技术难点、解决方案
网站信息搜索 >> 请输入关键词:
您当前的位置: 首页 > HTML5

HTML5入阶段内联标签汇总(小篇)

发布时间:2010-05-20 14:01:29 文章来源:www.iduyao.cn 采编人员:星星草
HTML5进阶段内联标签汇总(小篇)

内联元素,与别人公用一行,但是设置宽高无效。其特点:

  ①和其他元素都在一行上;
  ②高,行高及外边距和内边距不可改变;
  ③宽度就是它的文字或图片的宽度,不可改变
  ④内联元素只能容纳文本或者其他内联元素
代码如下:
 1 <!doctype html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>标签基础2</title>
 6 </head>
 7 <body>
 8     <!-- 内联元素 与别人公用一行 但是设置宽高无效 -->
 9 
10     <!-- 无语义 -->
11     <span>无语义</span>
12 
13     <!-- 图片 alt图片加载失败显示-->
14     <img src="d" alt="加载失败">
15 
16     <!-- 超链接 -->
17     <a href="http://www.baidu.com">跳转</a>
18 
19     <!-- 斜体强调 -->
20     <var>斜体强调作用</var>
21     <!-- em和i经常用于制作小图标 -->
22     <em>斜体强调作用</em>
23     <i>斜体强调作用</i>
24 
25     <!-- 加粗强调 -->
26     <strong>加粗强调</strong>
27 
28     <!-- 表单 提交数据-->
29     <form action="">
30         <!-- 输入框 -->
31         <input type="text">
32         <!-- 密码输入框 -->
33         <input type="password">
34         <!-- 按钮 -->
35         <input type="button" value="按钮">
36         <!-- 提交表单 -->
37         <input type="submit" value="提交表单">
38 
39         <!-- 日期 年月日-->
40         <input type="date">
41         <!-- 日期 年周 -->
42         <input type="week">
43         <!-- 日期 年月 -->
44         <input type="month">
45         <!-- 日期 当前时间 -->
46         <input type="time">
47 
48         <!-- 选择文件 -->
49         <input type="file" value="打开文件">
50         <!-- 只能输入数字 -->
51         <input type="number">
52         <!-- 颜色选择器 -->
53         <input type="color">
54         <!-- 重置 -->
55         <input type="reset">
56         <!-- 复选框 -->
57         <input type="checkbox">我爱你
58         <input type="checkbox">你爱我
59         <!-- 单选框 name 同名字为一组-->
60         <input type="radio" name="sex" checked="checked">61         <input type="radio" name="sex">62     </form>
63 
64     <!-- 多行文本 cols宽度 rows高度 -->
65     <textarea name="" id="" cols="30" rows="10"></textarea>
66 
67     <!-- 选择列表 默认第一个选项的值为初始值-->
68     <select name="" id="">
69         <option value="">选项1</option>
70         <option value="">选项2</option>
71         <option value="">选项3</option>
72     </select>
73 </body>
74 </html>

 

友情提示:
信息收集于互联网,如果您发现错误或造成侵权,请及时通知本站更正或删除,具体联系方式见页面底部联系我们,谢谢。

其他相似内容:

  • 使用HBuilder编辑器将html五页面打包成APP

    使用HBuilder编辑器将html5页面打包成APP   使用HBuilder编辑器将html5页面打包成APP (ios+安卓) 1.首先先安装HBuilder编...

  • 基于phonegap,html5,ratchet,handlebars等技术的微神情APP

    基于phonegap,html5,ratchet,handlebars等技术的微表情APP 该app是由很多有意思的微表情构成的,支持40种表情,并且每种表情都有不同的...

  • HTML5 Web 客户端五种离线储存方式汇总

    HTML5 Web 客户端五种离线存储方式汇总 最近折腾HTML5游戏需要离线存储功能,便把目前可用的几种HTML5存储方式研究了下,基于H...

  • SPICE-HTML5 鼠标指针BUG修补

    SPICE-HTML5 鼠标指针BUG修复 研究SPICE,找到了他们官方指定的HTML5客户端。 下载下来用一下,发现跟网页VNC的水平差不多了。 http:...

  • HTML5+JS 《五子飞》游戏实现(5)移动棋子

    HTML5+JS 《五子飞》游戏实现(五)移动棋子 上一章 我们知道了怎么处理两个重要的吃棋动作,想要吃对方的棋子,首先得移动自己的棋子。...

  • HTML5中怎么上传Resize后的图片

    HTML5中如何上传Resize后的图片 参考资料: 不依赖form标签,而是自己定义FormData上传数据,文件被编码为一个Blob或File对象: https...

  • (1)HTML5

    (一)HTML5 可以解决什么问题: 可以实现网页的ajax加载,同时又能完成URL的改变而没有网页跳转刷新的迹象,就像是改变了网页的hash(#)一样。...

  • 一款纯html5实现的钟表

    一款纯html5实现的时钟 今天给大家分享一款非常漂亮的纯html5实现的时钟。整个界面都由html5绘制而成。一起看下效果图: 在线预览...

  • 使用 WebSockets 开展 HTML5 视频直播

    使用 WebSockets 进行 HTML5 视频直播 实验环境:Ubuntu。 参考以下两个链接进行实践: http://segmentfault.com/blog/xingrz/119...

  • 查询浏览器是不是支持html5

    查询浏览器是否支持html5 js判断 插入js代码====================================================== <script> wind...

热门推荐: