HTML5 基础知识（四）

关于web图像：

1、格式与下载速度：当前web上应用最广泛的三种格式gif、png、jpeg。

JPEG格式适用于彩色照片，因为它包含大量的颜色并进行合理的压缩，采用这种格式保存的文件相对较小，全彩的照片通常保存为JPEG格式，PNG-24格式效果也很好，但是通常文件比JPEG要大的多。不过 JPEG是一种有损的格式

PNG和GIF是无损的格式，因此采用这两种格式对图像进行压缩不会造成品质的损失。GIF只有256种颜色，但PNG支持几百万种颜色。且均支持透明，适合用于保存非照片类的图像。

PNG有几种不同的分支，PNG-8 PNG-24 PNG-32 。一般来说对于PNG和GIF应该优先选择PNG，因为它对透明度的支持更好，压缩算法也更好，产生的文件更小。

2、颜色：

标识和其他颜色较少的图像通常保存为PNG-8格式

JPEG PNG-24 PNG-32均支持超过1600万种颜色，因此照片和复杂的插图应选择这些格式，不过，大多数情况下应该使用JPEG

3、大小：

数字图像以像素为单位进行度量。

4、透明度：

可以利用透明度为图像创建非矩形的边缘，在图像的下方设置背景色或图案，PNG和GIF都支持透明度，JPEG则不支持。

在GIF格式中一个像素要么透明要么不透明，称为索引色透明

PNG格式中既支持索引色透明，有支持alpha透明（可以控制一个像素透明的程度）。

PNG-8即支持索引色透明，也支持alpha透明，但需要使用FireWork这样的程序才能将图像保存为PNG-8格式。Photoshop不支持alpha透明的png-8格式，但支持alpha透明的PNG-32。总之对于透明图像应使用PNG-8或PNG-32。

5、动画：

动画可以保存为GIF，但不能是JPEG PNG。实际上，使用图像表现动画的已经越来越少了，通常使用css动画、javascript、svg、html5 canves 和flash。

RGB 分别代表 Red 红 Green 绿 Blue 蓝 RGB模式又被称为三原色光模式。

在页面中插入图像：

格式<img src="data:image.url" /> 其中 image.url指示图像文件在服务器上的位置。

提供替代文本

使用alt属性，可以为图像添加一段描述性文本。当图像因某种原因不显示的时候，就可以将这段文字显示出来。一般来说，替代文本是考虑图像未能正常加载的情况下需要呈现的文字。

格式<img src="data:image.url" alt="test" />

指定图像尺寸：

格式<img src="data:image.url" alt="test" width=“x” height=“y” />

链接：

链接有两个主要的部分，目标和标签

使用目标，可以指定访问者点击链接时会发生什么，其次是链接到其他网页的特定位置。

标签，访问者在浏览器看到或在屏幕阅读器中听到的部分。

创建一个指向另一个网页链接

a元素是创建链接的关键。格式 <a href="www.baidu,com" > </a>

创建錨并链接到錨：

通常激活一个链接会将用户带到对应网页的顶端。

HTML5 基础知识（四）相关推荐

html5基础知识文档,HTML5基础知识（1）
原标题:HTML5基础知识(1) html5是万维网的核心语言.标准通用标记语言下的一个应用超文本标记语言(HTML)的第五次重大修改.2014年10月29日,万维网联盟宣布,经过接近8年的艰苦努力, ...
（七）JS基础知识四（搞定异步）【三座大山之三，必考！！！】
JS基础知识四(异步) 提问单线程应用场景 callback hell和promise 提问同步和异步的区别是什么手写用Promise加载一张图片前端使用的异步的场景有哪些单线程 JS是单 ...
HTML5 基础知识
HTML5 基础知识什么是 HTML? HTML 是一种超文本标记语言,"超文本"就是指页面内可以包含图片.链接.深职音乐.视频.程序等非文字元素 HTML 不是一种编程语言 H ...
跳槽者、应届生必看JAVA面试题系列 - JAVA基础知识(四)
一: 前言莫等闲,白了少年头,空悲切. 二: 面试挑战在文章开始前,首先安利下"面试挑战": 凡是满足下面的挑战条件的,如果一个月内没有拿到一个Offer的,免费提供简历封 ...
html5哪个属性规定输入字段是必填的,HTML5基础知识习题及答案
原标题:HTML5基础知识习题及答案 1. HTML5 之前的HTML版本是什么? 答: HTML 4.01 2. HTML5 的正确doctype是? 答: 3. 在 HTML5 中,哪个元素用于组 ...
html5基础知识，期末复习大全
目录 1.1 Web系统体系结构 1.C/S(即Client/Server)结构 1.2 浏览器 1.排版引擎(Rendering Engine) 2.Javascript引擎 1.3 Web相关概 ...
C# 基础知识 (四).C#简介及托管代码
暑假转瞬即逝,从10天的支教生活到1周的江浙沪旅游,在这个漫长的暑假中我经历了很多东西,也学到了很多东西,也认识到了很多不足之处!闲暇之余我准备重新进一步巩固C#相关知识,包括C#入门 ...
post获取重定向的链接 python_【转载】python面试基础知识(四) 网络部分
最近,小编在整理python面试基础知识,看了很多博客.文章和咨询了一些大厂公司大牛.了解到,在python面试的时候,不仅要求你有项目经验,还要考试代码呢!今天,小编和大家分享一下python面试基 ...
Html5基础知识笔记
学习笔记,供个人快速查阅使用!! 公开分享,不喜勿喷! Html5基础介绍 h1标签 <h1>Hello World</h1> p标签如果想在网页上显示文章,这时就需要< ...
Java基础知识(四) 基本类型与运算
Java基础知识基本类型与运算 1. Java提供了哪些基本数据类型 2. 什么是不可变类 3. 值传递与引用传递的区别 4. Math类中的round.ceil和floor方法的功能各是什么 5. ...

HTML5 基础知识（四）

HTML5 基础知识（四）相关推荐

最新文章

热门文章