这一节内容可概括为：网页上插入图片，调整图片大小，使用缩略图链接至大图。

图片的三种格式：jpeg     png    gif

照片、复杂图像使用jpeg,单色图像、logo、几何图形使用png以及gif。

JPEG最适合连续色调图像，不支持透明度，文件比较小，便于Web页面高效显示，不支持动画。是一种”有损格式“，因为缩小文件大小时会丢掉图像的一些信息；包含多达1600万种不同颜色的图像。

PNG最适合单色图像和线条构成的图像（如logo、剪贴画、图像中的小文本）；分三种：PNG-8(支持256种颜色)、PNG-16(支持数千种颜色)、PNG-24（支持数百万种颜色）；是一种”无损”格式

压缩文件时不会丢掉信息；允许设置透明；与相应的JPEG相比，PNG更大。不过取决于PNG的颜色数，不都是绝对的大于。

GIF类似PNG，适用与简单图，可以表示256种不同颜色的图像；无损格式；支持透明度，不过只允许设置一种颜色透明；GIF往往比JPEG文件大；支持动画。

<a>标签可与<img>嵌套使用。<a href="lianjie"><img=""src="photo.jpg"></a>,点击图片链接到另一页面。

插入图片标签<img src="图片">    图片与主页同一目录。在图片较多时，可建立一个新的文件夹用于存放图片，如一文件夹中有子文件index.html与photos文件夹，则图片路径为<img src="photos/photo.jpg">。此外img标签还可有alt属性，alt="用于描述图片的文字"，当图片文件过大浏览器加载速度就越慢，在图片并未加载出现时alt属性的描述性文字就出现在原图位置。

<!DOCTYPE html>
<html>
<head>
<title>mypod.downtown</title></head>
<body>
<h1>Downtown</h1>
<p><img src="../photos/seattle_downtown.jpg"></p>
</body>
</html>

划线部分在写的时候出错 ,直接写了photo/seattle_downtown.jpg，图片加载不出。此代码为一个缩略图所链接的html页面，即缩略图的大图。有建立了一个存放大图html的文件夹（与photos文件夹同目录），要在html中找到大图，其相对路径从html文件夹返回上级父文件夹再进入photos文件夹找到seattle_downtown.jpg，..（dot dot 意为返回上级），因此路径改为../photos/seattle_downtown.jpg。

总结下来，做事太粗心，要注意细节细节细节!多思考！

html----有关图像的更多相关文章

  1. C#中如何调整图像大小

    在本篇文章中,我将介绍如何在C#中来调整你想要的图像大小.要实现这一目标,我们可以采取以下几个步骤: 1.首先要获取你想要调整大小的图像: string path = Server.MapPath(& ...

  2. 基于window7+caffe实现图像艺术风格转换style-transfer

    这个是在去年微博里面非常流行的,在git_hub上的代码是https://github.com/fzliu/style-transfer 比如这是梵高的画 这是你自己的照片 然后你想生成这样 怎么实现 ...

  3. 超全面的.NET GDI+图形图像编程教程

    本篇主题内容是.NET GDI+图形图像编程系列的教程,不要被这个滚动条吓到,为了查找方便,我没有分开写,上面加了目录了,而且很多都是源码和图片~ (*^_^*) 本人也为了学习深刻,另一方面也是为了 ...

  4. git图像化界面GUI的使用

    GIT学习笔记 一.        基础内容 1.git是一个版本控制软件,与svn类似,特点是分布式管理,不需要中间总的服务器,可以增加很多分支. 2.windows下的git叫msysgit,下载 ...

  5. CSharpGL(24)用ComputeShader实现一个简单的图像边缘检测功能

    CSharpGL(24)用ComputeShader实现一个简单的图像边缘检测功能 效果图 这是红宝书里的例子,在这个例子中,下述功能全部登场,因此这个例子可作为使用Compute Shader的典型 ...

  6. 【.net深呼吸】WPF异步加载大批量图像

    如何在WPF中加载大批量数据,并且不会阻塞UI线程,尤其是加载大量图片时,这活儿一直是很多朋友都相当关注的.世上没有最完美的解决之道,咱们但求相对较优的方案. 经过一些试验和对比,老周找到了一种算是不 ...

  7. 了解HTML图像

    img <img>表示image图像,从技术上讲,<img>标签并不会在网页中插入图像,而是从网页上链接图像.<img> 标签创建的是被引用图像的占位空间. [必须 ...

  8. 四种比较简单的图像显著性区域特征提取方法原理及实现-----> AC/HC/LC/FT。

    laviewpbt  2014.8.4 编辑 Email:laviewpbt@sina.com   QQ:33184777 最近闲来蛋痛,看了一些显著性检测的文章,只是简单的看看,并没有深入的研究,以 ...

  9. 图像抠图算法学习 - Shared Sampling for Real-Time Alpha Matting

    一.序言   陆陆续续的如果累计起来,我估计至少有二十来位左右的朋友加我QQ,向我咨询有关抠图方面的算法,可惜的是,我对这方面之前一直是没有研究过的.除了利用和Photoshop中的魔棒一样的技术或者 ...

  10. 如何快速清除ZBrush画布中多余图像

    ZBrush是一款数字雕刻与绘画软件,它以强大的功能和直观的工作流程彻底改变了整个三维行业.它的简洁化.智能化和人性化的设计无不让众多用户所折服.刚接触它的用户可能会因为找不到相关命令或不熟悉而觉得它 ...

随机推荐

  1. 纯JS写的一款记录事项的单页应用

    要点: 1.使用localStorage存储 2._change_record_progress函数以字符串作为参数,用eval执行这个参数 3.使用了jQuery自定义事件,便于数据改变时实时更新显 ...

  2. BZOJ 2243: [SDOI2011]染色 树链剖分+线段树区间合并

    2243: [SDOI2011]染色 Description 给定一棵有n个节点的无根树和m个操作,操作有2类: 1.将节点a到节点b路径上所有点都染成颜色c: 2.询问节点a到节点b路径上的颜色段数 ...

  3. 在myeclipse下面创建多层包

    比如animal.cat.dog包 先创建animal包 然后创建animal.cat包 最后创建animal.cat.dog包 最后你发现这三个文件夹是分层的,层层嵌套的三个文件夹,而不是一个文件夹 ...

  4. Hibernate 之 Why?

    本文主要是从一个宏观的角度来认识Hibernate,对为什么用Hibernate进行一些说明,通过指导并了解Hibernate的特性及其优缺点可以让我们在以后的项目中根据具体的情况进行选择. Hibe ...

  5. vs2010中设置qt环境的智能识别方案

    Qt搭建请参考:Win7系统VS2010下搭建qt开发环境 搭建好之后,虽然可以编译过去,但是写代码时,编辑器无法识别,也没有智能提示,并且代码中都是红色的提示如下: 此时需要设置一下include路 ...

  6. python 线程 进程 标识

    s = '%s%s%s%s%s%s%s%s' % ( time.strftime('%Y%m%d %H:%M:%S', time.localtime(time.time())), ' os.getpp ...

  7. luogu 4720 【模板】扩展卢卡斯

    题目大意: 求$C_n^m \mod p$,p不一定为质数 思路: 首先可以将$p$分解为$p1^{a1}*p2^{a2}*...*pk^{ak}$,对于这些部分可以使用$CRT$合并 对于每个$p_ ...

  8. AutoIT: 对文件系统的菜单进行操作，有专门的语句WinMenuSelectItem

    对文件系统的菜单进行操作,有专门的语句WinMenuSelectItem: Run("notepad.exe") WinWaitActive("[CLASS:Notepa ...

  9. asp.net MVC 切换网站主题

    首先要有一些定义后的CSS文件,本例是用Bootstrap作为前端框架,可以从http://bootswatch.com/网站上下载一些主题文件,也就是一些定义好的Bootstap.css的文件. 然 ...

  10. node 中mongoose使用validate和密码加密的问题

    在今天一直被一个问题困扰,就算是使用mongoose的alidate的时候想要限制密码的位数,比如不能少于几位,但是一直出错. 最后发现原来使用validate的时候,是在数据将要存入数据库的时候,因 ...