HTML内容元素中图片元素
使用img元素:src属性:图片路径。
alt属性:图片无法显示的时候使用替代文本,title属性:鼠标悬停时显示文本内容。
在同一张图片上点击不同的位置链接到不同的页面上
使用map,和area元素(map是area的父元素)

加上id或者name是为了解决兼容性。

shap形状分类:圆形,矩形,多边形,(点击区域的形状)。

href:形状的链接地址。

coords:形状的位置。
圆形(cicle),多边形(poly) 矩形(rectangle)
coords;矩形(左上角x轴坐标,y轴,右下角x,y,轴坐标)
圆形:(圆心点x,y,轴,半径)
父级元素(figure)
子集元素(img和figcaption,其中figcaption是对img的解释或相关内容)
controls视屏控件
controls autoplay=“” 自动播放 loop(循环播放)
对img设置宽高时,只设置一个值,拧一个会自动生成。(等比例缩放)
url(统一资源路径)
background-image:url('')背景图片
实现雪碧图的步骤:1.给尺寸,2.应用位置(background-image:url())3.给位置(background-position:x,y,轴)
用非块级元素包含

如何在html中插入图片的更多相关文章

  1. 如何在github中插入图片,链接,图片链接(给图片加上链接),文字+图片链接,的实战分享!

    如何在github中插入图片,链接,图片链接(给图片加上链接),文字+图片链接,的实战分享! markdown 1.文字链接: [link-Text](link-URL) [home](https:/ ...

  2. Doxyfile中插入图片

    下面讲一下如何在doxyfile中插入图片 在查看别人写的文档的过程中,看到可以在doxyfile中插入图片,对此十分的好奇,所以拿出来研究一下 那么这是如何实现的? 根据代码,可以看到如下的注释 @ ...

  3. 如何在latex 中插入EPS格式图片

    如何在latex 中插入EPS格式图片 第一步:生成.eps格式的图片 1.利用visio画图,另存为pdf格式的图片 利用Adobe Acrobat裁边,使图片大小合适 另存为.eps格式,如下图所 ...

  4. 如何在excel单元格中插入图片批注

    在excel单元格中插入图片批注的方法: 1.选定要插入图片的单元格,然后右键选择插入批注. 2.然后会插入一个批注框,为了不影响图片效果,可以将批注文字都删除.然后鼠标移动到批注框边角再右键. 3. ...

  5. 如何在html中插入视频

    如何在html中插入视频 1,插入优酷视频: 在优酷分享界面有个html代码,直接复制放入body中,定义div的align居中即可 2.插入本地视频:用video属性  用mp4格式 <vid ...

  6. java POI实现向Excel中插入图片

          做Web开发免不了要与Excel打交道.今天老大给我一个任务-导出Excel.开始想的还是蛮简单的,无非就是查找,构建Excel,response下载即可.但是有一点不同,就是要加入图片, ...

  7. 在Altium_Designer_PCB_中插入图片的方法

    详细请看PDF: http://files.cnblogs.com/files/BinB-W/在Altium_Designer_PCB_中插入图片的方法.pdf 配套文件: http://files. ...

  8. 在LaTeX文档中插入图片的几种常用的方法

    LaTeX中一般只直接支持插入eps(Encapsulated PostScript)格式的图形文件, 因此在图片插入latex文档之前应先设法得到图片的eps格式的文件. 在LaTeX文档中插入图片 ...

  9. Android向系统相册中插入图片,相册中会出现两张 一样的图片(只是图片大小不一致)

    向系统相册中插入图片调用此方法时,相册中会出现两张一样的图片 MediaStore.Images.Media.insertImage 一张图片是原图一张图片是缩略图.表现形式为:android4.4. ...

随机推荐

  1. html发展史简介(摘抄)

    1993年,IETF,Internet工程任务组(Internet Engineering Task Force)的简写.IETF又叫互联网工程任务组,成立于1985年底,是全球互联网最具权威的技术标 ...

  2. 把连接中传的参数截取出来变成一个json对象

    获取url function test() { var url=window.location.search; if(url.indexOf("?")!=-1) { var str ...

  3. Office - InfoPath

    1. 移除隐藏空间后剩余的空白: http://social.technet.microsoft.com/Forums/sharepoint/zh-TW/3dea3014-f808-428b-b283 ...

  4. C++基础--class的大小

    在这里列出了空类,类有函数,值,没有函数的大小,注意Class也是默认字节对齐 #include <stdio.h> class x { }; class cx { public: cx( ...

  5. Android菜单(动画菜单、360波纹菜单)

     Android菜单(动画菜单.360波纹菜单) 前言:Android菜单常用集合:FragmentTabHost系统菜单.上移式菜单.360波纹菜单.展开式菜单.详解注释,可直接拿来用! 效果:   ...

  6. idea 多项目部署碰到的问题

    在使用idea部署多个maven项目的时候,出现了各种坑.一天的时间有一半的时间花在了部署环境.运行环境上.把遇到的坑记录下 1.引入maven的依赖包 当项目多的时候,为了加速项目的开发,习惯性的把 ...

  7. java实现哈弗曼树和哈夫曼树压缩

    本篇博文将介绍什么是哈夫曼树,并且如何在java语言中构建一棵哈夫曼树,怎么利用哈夫曼树实现对文件的压缩和解压.首先,先来了解下什么哈夫曼树. 一.哈夫曼树 哈夫曼树属于二叉树,即树的结点最多拥有2个 ...

  8. Azure 中 Linux 虚拟机的大小

    本文介绍可用于运行 Linux 应用和工作负荷的 Azure 虚拟机的可用大小与选项. 此外,还提供在计划使用这些资源时要考虑的部署注意事项. 本文也适用于 Windows 虚拟机. 类型 大小 说明 ...

  9. leetcode-surrounded regions-ZZ

    Problem Statement (link): Given a 2D board containing 'X' and 'O', capture all regions surrounded by ...

  10. flashback回收站知识汇总

    查看回收站是否开启:SELECT Value FROM V$parameter WHERE Name = 'recyclebin'; 查看回收站中的数据:SELECT * FROM DBA_RECYC ...