html----有关图像
这一节内容可概括为:网页上插入图片,调整图片大小,使用缩略图链接至大图。
图片的三种格式: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----有关图像的更多相关文章
- C#中如何调整图像大小
在本篇文章中,我将介绍如何在C#中来调整你想要的图像大小.要实现这一目标,我们可以采取以下几个步骤: 1.首先要获取你想要调整大小的图像: string path = Server.MapPath(& ...
- 基于window7+caffe实现图像艺术风格转换style-transfer
这个是在去年微博里面非常流行的,在git_hub上的代码是https://github.com/fzliu/style-transfer 比如这是梵高的画 这是你自己的照片 然后你想生成这样 怎么实现 ...
- 超全面的.NET GDI+图形图像编程教程
本篇主题内容是.NET GDI+图形图像编程系列的教程,不要被这个滚动条吓到,为了查找方便,我没有分开写,上面加了目录了,而且很多都是源码和图片~ (*^_^*) 本人也为了学习深刻,另一方面也是为了 ...
- git图像化界面GUI的使用
GIT学习笔记 一. 基础内容 1.git是一个版本控制软件,与svn类似,特点是分布式管理,不需要中间总的服务器,可以增加很多分支. 2.windows下的git叫msysgit,下载 ...
- CSharpGL(24)用ComputeShader实现一个简单的图像边缘检测功能
CSharpGL(24)用ComputeShader实现一个简单的图像边缘检测功能 效果图 这是红宝书里的例子,在这个例子中,下述功能全部登场,因此这个例子可作为使用Compute Shader的典型 ...
- 【.net深呼吸】WPF异步加载大批量图像
如何在WPF中加载大批量数据,并且不会阻塞UI线程,尤其是加载大量图片时,这活儿一直是很多朋友都相当关注的.世上没有最完美的解决之道,咱们但求相对较优的方案. 经过一些试验和对比,老周找到了一种算是不 ...
- 了解HTML图像
img <img>表示image图像,从技术上讲,<img>标签并不会在网页中插入图像,而是从网页上链接图像.<img> 标签创建的是被引用图像的占位空间. [必须 ...
- 四种比较简单的图像显著性区域特征提取方法原理及实现-----> AC/HC/LC/FT。
laviewpbt 2014.8.4 编辑 Email:laviewpbt@sina.com QQ:33184777 最近闲来蛋痛,看了一些显著性检测的文章,只是简单的看看,并没有深入的研究,以 ...
- 图像抠图算法学习 - Shared Sampling for Real-Time Alpha Matting
一.序言 陆陆续续的如果累计起来,我估计至少有二十来位左右的朋友加我QQ,向我咨询有关抠图方面的算法,可惜的是,我对这方面之前一直是没有研究过的.除了利用和Photoshop中的魔棒一样的技术或者 ...
- 如何快速清除ZBrush画布中多余图像
ZBrush是一款数字雕刻与绘画软件,它以强大的功能和直观的工作流程彻底改变了整个三维行业.它的简洁化.智能化和人性化的设计无不让众多用户所折服.刚接触它的用户可能会因为找不到相关命令或不熟悉而觉得它 ...
随机推荐
- 6 使用Ionic开发天气应用
简介:本节课我们会制作一款天气应用,这款应用允许用户查看当前的天气情况.天气预报以及地点收藏,在模态框内显示日出和日落的数据,使用分页滚动面板显示天气信息,使用侧滑菜单实现导航. 6.1 项目配置 环 ...
- 【iOS系列】-UITableViewCell的展开与收缩的实现思路
UITableViewCell的展开与收缩的实现思路 现在项目中很多地方都会用到,所以我这里介绍一种可以复用的思路,这与文章后面的Swift的实现思路不同,具体大家可自行对比. Demo项目地址 开始 ...
- js实现replaceAll功能
js中没有原生的replaceAll 方法. function replaceAll(str , replaceKey , replaceVal){ var reg = new RegExp(repl ...
- Django值聚合,分组,事物,cookie,session
1,聚合(aggregate):是queryset的一个 终止语句,它返回一个包含键值对的字典,键是的名称是聚合值的标识符,值是计算出来的聚合值,键的名称是按照字段和聚合函数自动生成出来的.用到的内置 ...
- 演练:使用属性自定义 DataGrid 控件
演练:使用属性自定义 DataGrid 控件 Silverlight 此主题尚未评级 - 评价此主题 Silverlight DataGrid 控件支持常用表格式设置选项,例如交替显示不同的行 ...
- MyEclipse8.5优化
MyEclipse8.5优化 第一步: 取消自动validation validation有一堆,什么xml.jsp.jsf.js等等,我们没有必要全部都去自动校验一下,只是需要的时候才会手工校验一下 ...
- jQuery - AJAX 级联变动
此篇文章主要是用来记忆使用JQUERY+AJAX技术实现 二级级联变动 : 当第一个下拉框变动时,第二个下拉列表框中也将会随之变动. JSP: ---------------------------- ...
- action 与 action 之间的跳转
这个要看你的两个action是不是在通一个package下了 <!-- 相同package下调用其它action --><action name="loginUser&qu ...
- HDU - 1863 畅通工程(最小生成树)
d.m个村庄,n条路,计算出所有村庄畅通需要的最低成本. s.最小生成树 c.Prim算法:cost[a][b]和cost[b][a]都得赋值. /* Prim算法 Prim求MST 耗费矩阵cost ...
- NPU 2015年陕西省程序设计竞赛网络预赛(正式赛)F题 和谐的比赛(递推 ||卡特兰数(转化成01字符串))
Description 今天西工大举办了一场比赛总共有m+n人,但是有m人比较懒没带电脑,另外的n个人带了电脑.不幸的是,今天机房的电脑全坏了只能用带的电脑,一台电脑最多两人公用,确保n>=m. ...