介绍：在html网页中，图片和视频是基本的元素，在网页中插入图片和视频有自己的标签，分别是img、embed，来源都是使用src来链接。

插入图片：

<img src="图片的来源" alt="图片的介绍" title="鼠标放在图片时显示的信息">

使用alt：是为了方便搜索引擎识别图片，因为基本上搜索引擎是不能直接识别二进制的图片的。

使用title：是为了方便用户鼠标触碰图片查看一些相关的信息。

插入视频：

<embed src="视频来源" allowFullScreen="视频全屏" quality="视频质量" width="宽" height="高" .......> </embed>

代码：

<html>

<head>

  <title>插入图片和文字</title>

</head>

  <body>

    <h2>插入图片</h2>

    <img src="http://img.zcool.cn/community/03378c3554c7a5e00000158fc5f68ad.jpg" alt="baidu logol" title="百度的logol">

    <h2>插入视频</h2>

    <embed src="http://player.youku.com/player.php/sid/XMTQ4MTQ5MTQ2OA==/v.swf" allowFullScreen="true" quality="high" width="480" height="400" align="middle" allowScriptAccess="always" type="application/x-shockwave-flash"></embed>

  </body>

</html>

截图：

HTML：图片和视频标签的使用的更多相关文章

  1. HTML5笔记2——HTML5音/视频标签详解

    音视频的发展史 早期:<embed>+<object>+文件 问题:不是所有浏览器都支持,而且embed不是标准. 现状:Realplay.window media.Quick ...

  2. html5音频和视频标签

    在html5之前的版本中如果想要在网页中插入音频和视频必须要安装插件才可以,比如最常见的flash插件.很多人在刚安装一款浏览器的时候都会遇到浏览器建议安装flash插件,在移动端也是如此.如果想要在 ...

  3. 在Vue项目使用quill-editor带样式编辑器（更改插入图片和视频）

    vue-quill-editor默认插入图片是直接将图片转为base64再放入内容中,如果图片比较大的话,富文本的内容就会很大. 插入视频是直接弹框输入URL地址,某些需求下我们需要让用户去本地选择自 ...

  4. HTML5_音视频标签 <audio> 和 <video>

    HTML5_音视频标签 <audio> 和 <video> audio 和 video 都是 inline行内元素 如果浏览器支持,则不显示标签文本 IE8 不支持 audio ...

  5. 自定义jq插件，鼠标悬浮展示图片或者视频放大图，可自定义展示内容

    网站项目经常会遇到一些视频或者图片素材的展示功能,那么就需要自己写一个功能,就是在一些列表页面你想要是这个数据的详细内容,弹框在页面某个位置 例如这是视频悬浮展示效果,可自定义自动播放等属性标签 又例 ...

  6. android--------WebView实现 Html5 视频标签加载

    自Android 4.4起,Android中的WebView开始基于Chromium(谷歌浏览器)支持浏览器的一系列功能,webkit解析网页各个节点,这个改变,使得WebView的性能大幅度提升,并 ...

  7. MVP+Dagger2+Rxjava+Retrofit+GreenDao 小应用，包含新闻、图片、视频3个大模块，代码整洁干练

    练习MVP架构开发的App,算是对自己学过的知识做一个总结,做了有一段时间,界面还算挺多的,代码量还是有的,里面做了大量封装,整体代码整理得很干净,这个我已经尽力整理了.不管是文件(Java.xml. ...

  8. MVP+Dagger2+Rxjava+Retrofit+GreenDao 开发的小应用，包括新闻、图片、视频3个大模块，代码封装良好

    练习MVP架构开发的App,算是对自己学过的知识做一个总结,做了有一段时间,界面还算挺多的.代码量还是有的,里面做了大量封装,总体代码整理得非常干净,这个我已经尽力整理了. 不管是文件(java.xm ...

  9. uni-app实现图片和视频上传功能

    使用uni-app实现点击上传,既可以上传视频,有可以上传图片,图片预览,删除图片和视频功能,最终效果如下.uni-app里面没有提供同时上传视频和图片这个插件,只能靠自己手写,  1.页面布局 通过 ...

随机推荐

  1. VuGen：一般选项General Option

  2. 解决引入keras后出现的Using TensorFlow backend的错误

    在引入头文件之后,加入 import os os.environ['KERAS_BACKEND']='tensorflow' 就可以完美解决这个问题

  3. 洛谷P2801 教主的魔法 [分块，二分答案]

    题目传送门 教主的魔法 题目描述 教主最近学会了一种神奇的魔法,能够使人长高.于是他准备演示给XMYZ信息组每个英雄看.于是N个英雄们又一次聚集在了一起,这次他们排成了一列,被编号为1.2.…….N. ...

  4. CF815C Karen and Supermarket [树形DP]

    题目传送门 Karen and Supermarket On the way home, Karen decided to stop by the supermarket to buy some gr ...

  5. Java Web开发——HTML CSS JavaScript 杂记

    HTML是一种在互联网上常见的网页制作标注性语言,并不能算作一种程序设计语言.因为它相对程序设计语言来说缺少了其应所有的特征.对于网站设计人员来说,只使用HTML是不够的,需要在页面中引入CSS样式. ...

  6. 深入理解javascript函数系列第三篇

    前面的话 函数是javascript中特殊的对象,可以拥有属性和方法,就像普通的对象拥有属性和方法一样.甚至可以用Function()构造函数来创建新的函数对象.本文是深入理解javascript函数 ...

  7. FastReport.Net使用：[37]报表继承

    1.设计一个基础报表,将其保存为BaseReport. 2.新建一个继承的报表. 通过 文件-->新建 打开“新建对象”向导.选择“继承的报表”,点击确定. 3. 在打开对话框中选择基础报表Ba ...

  8. POJ 3228 [并查集]

    题目链接:[http://poj.org/problem?id=3228] 题意:给出n个村庄,每个村庄有金矿和仓库,然后给出m条边连接着这个村子.问题是把所有的金矿都移动到仓库里所要经过的路径的最大 ...

  9. 【UOJ #205】【APIO 2016】Fireworks

    http://uoj.ac/problem/205 好神的题啊. dp[i][j]表示以i为根的子树调整成长度j需要的最小代价. 首先要观察到dp值是一个下凸壳. 因为从儿子合并到父亲时要把所有儿子的 ...

  10. CSS 笔记——阴影、圆角、旋转、光标

    7. 阴影.圆角.旋转.光标 (1)box-shadow 阴影 基本语法 text-shadow: h-shadow v-shadow blur color; box-shadow: h-shadow ...