html5--1.9 img元素嵌入图片

学习要点:

img元素嵌入图片
学习一个新属性:title


1.img的属性

1.src:必要属性,制定图片来源的路径;

2.alt属性:当图片无法显示时的替代文字

3.width和height属性,指定图片的宽度和高度;单位是像素百分比

1、我们只设置了宽高中的一个的时候,设置成像素的时候,图片也会按照比例变化

两个都设置的话,就不按照比例变化了

2、设置高度的时候,百分比是不能用的,因为高度不固定,内容变化的时候高度就变了,所以高度设置为定值。


title属性

title属性:属性值为字符串,效果是当鼠标移动到该位置时显示该内容。

html5--1.9 img元素嵌入图片的更多相关文章

  1. HTML5之新增的元素

    今天打开博客看到自己有了一个小粉丝,说实话还是蛮开心的,坚持写博客大半年了,终于迎来了自己的第一个小伙伴.总算是坚持了那么久的事情看到了结果吧. 前几天参加了我们学院老师的比赛---<青年教师大 ...

  2. 基于HTML5的可预览多图片Ajax上传

    一.关于图片上传什么什么的 在XHTML的时代,我们使用HTML file控件上传图片一次只能上传一张.要一次上传多图,做法是借助于flash.例如swfupload.js.可惜,使用复杂的点,比如f ...

  3. 各浏览器下使用 OBJECT 元素和 EMBED 元素嵌入 Flash 存在差异

    标准参考 OBJECT 元素定义了一个嵌入的对象.其引入的初衷是取代 IMG 和 APPLET 元素.不过由于安全等各方面原因以及缺乏浏览器支持,这一初衷并未实现.浏览器的对象支持依赖于对象类型.然而 ...

  4. HTML5表单新增元素与属性

    form属性 在html4中,表单的从属元素必须写在表单内部,而在HTML5中,可以把他们书写在任何地方,然后为该元素指定一个form属性,属性值为该表单的id,这样就可以声明该元素从属于指定表单了. ...

  5. html5表单新增元素与属性2

    1.标签的control属性 在html5中,可以在标签内部放置一个表单元素,并且通过该标签的control属性来访问该表单元素. <script> function setValue() ...

  6. HTML5 file API加canvas实现图片前端JS压缩并上传

    一.图片上传前端压缩的现实意义 对于大尺寸图片的上传,在前端进行压缩除了省流量外,最大的意义是极大的提高了用户体验. 这种体验包括两方面: 由于上传图片尺寸比较小,因此上传速度会比较快,交互会更加流畅 ...

  7. 读书笔记:《HTML5开发手册》--HTML5新的结构元素

    读书笔记:<HTML5开发手册> (HTML5 Developer's CookBook) 虽然从事前端开发已有很长一段时间,对HTML5标签也有使用,但在语义化上面理解还不够清晰.之前在 ...

  8. 【原】HTML5 新增的结构元素——能用并不代表对了

    做移动端有一段时间,今天有同事问了我 article 和 section 标签的使用,模模糊糊的解释了下,他似懂非懂,有点小尴尬.忽然间觉得自己有必要再翻翻书籍,重温下 html5 的新元素.html ...

  9. 【HTML5+MVC4】xhEditor网页编辑器图片上传

    准备工作: 创建一个MVC项目中,添加好xhEditor插件 相关用法:http://www.cnblogs.com/xcsn/p/4701497.html 注意事项:xhEditor分为v1.1.1 ...

随机推荐

  1. Shell脚本之:字符串

    字符串可以用单引号,也可以用双引号,也可以不用引号. 单引号 str='this is a string' 单引号字符串的限制: 1.单引号里的任何字符都会原样输出,单引号字符串中的变量是无效的: 2 ...

  2. 统一建模语言(UML,Unified Modeling Language)

    Something about UML: 统一建模语言(UML,英语:Unified Modeling Language)是非专利的第三代建模和规约语言.UML是一种开放的方法,用于说明.可视化.构建 ...

  3. mha安装报错 [error][/usr/share/perl5/vendor_perl/MHA/MasterMonitor.pm, ln361] None of slaves can be master. Check failover configuration file or log-bin settings in my.cnf

    查找资料 参考 http://blog.51cto.com/16769017/1878451 解决方法: 在两个从库上开启二进制日志即可(花了 一天时间,找不到解决方法,最后还是靠自己的理解及测试解决 ...

  4. Solr局部或指定字段更新之set用法

    solr wiki文档也有        http://yonik.com/solr/atomic-updates/         java code   public static void up ...

  5. OpenGL研究3.0 多边形区域填充

    OpenGL研究3.0 多边形区域填充 DionysosLai(906391500@qq.com)2014-06-22 所谓多边形区域填充.就是将多边形内部区域,所有已相同色块填充.注意:这里讨论的多 ...

  6. bit-map再显身手:test.txt中有42亿个无符号整数, 求不存在于test.txt中的最小无符号整数。限制: 可用内存为600MB.

    先看看这个题目:test.txt中有42亿个无符号整数, 求不存在于test.txt中的最小无符号整数. 限制: 可用内存为600MB. 又是大数据. 看到42亿, 有灵感没? 要知道, 2的32次方 ...

  7. ordinal parameter mismatch

    © 版权声明:本文为博主原创文章,转载请注明出处 错误描述:Caused by: org.hibernate.HibernateException: ordinal parameter mismatc ...

  8. hashCode与equals的作用与区别及应当注意的细节

    最近去面试了几家公司,被问到hashCode的作用,虽然回答出来了,但是自己还是对hashCode和equals的作用一知半解的,所以决定把它们研究一下. 以前写程序一直没有注意hashCode的作用 ...

  9. poj 1163 The Triangle 记忆化搜索

    The Triangle Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 44998   Accepted: 27175 De ...

  10. eval(function(p,a,c,k,e,d){e=function(c)加解密

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...