首页
Web开发
Windows程序
编程语言
数据库
移动开发
系统相关
微信
其他好文
会员
首页
>
其他好文
> 详细
5为你的页面增加图像
时间:
2017-03-20 14:18:47
阅读:
159
评论:
0
收藏:
0
[点我收藏+]
标签:
save
用户
单击
网上
宽度
应用
通过
位置
指定
使用<img>元素在Web页面中放置图像。
浏览器对<img>元素的处理与其他HTML元素稍有不同。读取HTML页面之后,浏览器会从Web服务器获取各个图像并显示。
如果Web页面上有多个大图像,则可以通过创建图像的缩略图使你的Web页面更可用,下载也更快,缩略图是一些小图像(大图像的缩小版本),用户单击这些缩略图时可以看到原来的大图像。
<img>元素是一个内联元素,这说明浏览器不会在图像前后插入一个换行。
要利用src属性指定图像文件的位置。可以在src属性中使用相对路径包含你自己的网站中的图像,或者可以使用URL包含其他网站的图像。
<img>元素的alt属性是对图像的一个有意义的描述。在一些浏览器中,如果无法找到图像,就会显示这个描述,另外屏幕阅读器会使用这个属性为有视力障碍的人描述图像。
图像宽度要小于800像素,这是Web页面中关于照片大小的一个好经验。数码相机拍摄的大多数照片都太大,不能很好地放在Web页面中,所以需要调整它们的大小。
有很多照片编辑应用,Photoshop Elementsis就是其中之一,可以用来调整图像的大小。还可以使用很多免费的联机工具调整图像大小。可以在网上搜索“free online image editor”(免费联机图像编辑器)。
对于浏览器来说太大的图像会使Web页面很难使用,而且下载和显示都很慢。
JPEG、PNG和GIF是Web浏览器广泛支持的3种图像格式。
JPEG格式最适合保存照片和其他复杂图像。
GIF或PNG格式最适合保存logo和其他包含单色、线条或文本的简单图形。
JPEG图像可以按不同质量压缩,所以可以很好地权衡图像质量和文件大小,来满足你的需要。
GIF和PNG图像格式允许建立一个有透明背景的图像。如果把一个有透明背景的图像放在一个Web页面中,图像后面的东西(如页面的背景色)就会透过图像的透明部分显示出来。
GIF和PNG是无损格式,这说明相比于JPEG文件,这些格式的文件往往更大。
PNG可以提供比GIF更好的透明度控制,而且不像GIF只支持256种颜色,PNG可以支持更多颜色。
PNG有3种不同的大小选择:PNG-24(支持数百万种颜色)、PNG-16(支持数千种颜色),以及PNG-8(支持256种颜色),可以根据需要来选择。
在Photoshop Elements中,使用“Save for Web”(保存为Web格式)对话框中的Matte(蒙版)颜色菜单来选择合适的颜色,柔化PNG或GIF图像的边缘。
图像可以用作指向其他Web页面的链接。要由图像创建一个链接,可以使用<img>元素作为<a>元素的内容,将链接放在<a>元素的href属性中。
5为你的页面增加图像
标签:
save
用户
单击
网上
宽度
应用
通过
位置
指定
原文地址:http://www.cnblogs.com/giscode/p/6587911.html
踩
(
0
)
赞
(
0
)
举报
评论
一句话评论(
0
)
登录后才能评论!
分享档案
更多>
2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)
周排行
更多
分布式事务
2021-07-29
OpenStack云平台命令行登录账户
2021-07-29
getLastRowNum()与getLastCellNum()/getPhysicalNumberOfRows()与getPhysicalNumberOfCells()
2021-07-29
【K8s概念】CSI 卷克隆
2021-07-29
vue3.0使用ant-design-vue进行按需加载原来这么简单
2021-07-29
stack栈
2021-07-29
抽奖动画 - 大转盘抽奖
2021-07-29
PPT写作技巧
2021-07-29
003-核心技术-IO模型-NIO-基于NIO群聊示例
2021-07-29
Bootstrap组件2
2021-07-29
友情链接
兰亭集智
国之画
百度统计
站长统计
阿里云
chrome插件
新版天听网
关于我们
-
联系我们
-
留言反馈
© 2014
mamicode.com
版权所有 联系我们:gaon5@hotmail.com
迷上了代码!