介绍：在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. 保存最后N个元素

    cookbook系列 问题:对要搜索的值的最后几项做个有限的历史记录. 方案: #coding=utf- from collections import deque def search(lines, ...

  2. c++ primer 4 数组和指针

    类比的思想学习数组和指针,c++提供类似于vector和迭代器的低级复合类型——数组和指针.与vector相似,数组可以保存某一种类型的一组对象:而他们的区别在于,数组的长度固定,数组一经创建就不允许 ...

  3. Selenium--testNG下载地址

    TestNG - http://beust.com/eclipse   http://testng.org/doc/eclipse.html http://testng.org/doc/seleniu ...

  4. 【SQL SERVER】触发器（二）

    前言:上面一片文章整理了触发器的基础知识点,下面我们看看如何使用触发器以及insert和delete表: 这里我们补充一下触发器的缺点: 性能较低.我们在运行触发器时,系统处理的大部分时间花费在参照其 ...

  5. Windows下配置Apache服务器

    第一步:下载最新Apache. 下载网址:http://www.apachehaus.com/cgi-bin/download.plx 第二步:把下载文件解压缩到一个工作目录.D:\Apache 第三 ...

  6. BNUOJ 52506 Captcha Cracker

    简单模拟题. #include<bits/stdc++.h> using namespace std; ]; int T; int main() { scanf("%d" ...

  7. zookpeer应用和zkclient实践

    分布式 zkclient 排它锁 在需要获取排它锁时,通过调用create()接口,创建临时子节点.zk会保证在所有客户端中,只有一个会创建成功,从而获取锁. 其他客户端注册该节点的变更watch监听 ...

  8. Linux-I/O五种模型

    一. 概念说明 在进行解释之前,首先要说明几个概念: 用户空间和内核空间 进程切换 进程的阻塞 文件描述符 缓存 I/O 同步(Sync)/异步(Async) 阻塞(Block)/非阻塞(Unbloc ...

  9. 网络流24题之最长k可重线段集问题

    对于每个线段拆成两个点,如同之前一样建图,由于可能出现垂直于x轴的 所以建图由i指向i~ 继续最小费用最大流 By:大奕哥 #include<bits/stdc++.h> using na ...

  10. [BZOJ4872][六省联考2017]分手是祝愿(期望DP)

    4872: [Shoi2017]分手是祝愿 Time Limit: 20 Sec  Memory Limit: 512 MBSubmit: 516  Solved: 342[Submit][Statu ...