您的位置：首页 > Web前端

Web前端开发-6

2016-03-08 15:07 363 查看
/[b]************************************[/b]

本文主要记述了web前端开发中图像布局等问题

[b]*************************************[/b]/

一、概述

图像标签：img，这个标签是自闭合标签，有三个属性值，分别是src定义图像的路径，alt是给搜索引擎看的，方便你的图像被搜索到，title是给用户看到，鼠标放到图像上显示什么。

<img src="../cc/1.jpg" alt="cc的照片" title="cc"/>


完整的套路为：

<html>
<head>
<title>img标签的用法</title>
</head>
<body>
<img src="d:/cc/1.jpg" alt=''cc's picture" title="cc"/>
</body>
</html>


效果图为：



二、绝对路径和相对路径

在img标签内的src写路径时候可以采用绝对或者相对路径。但是在实际开发过程中，往往采用相对路径。绝对路径很多情况下编译器无法进行的编译。

绝对路径写法：

<img src="d:/cc/1.jpg" alt="cc" title="lala"/>


相对路径写法：

<img src="cc/1.jpg" alt="cc" title="lala"/>    //这种情况是文件夹cc和网页文件在一个根目录下面
<img src="../cc/1.jpg" alt="cc" title="lala"/>  //这种情况是文件夹cc在网页文件的上一级目录。这里要记住..表示上一级目录的意思。


注意：”../“表示上一级目录的意思

三、图像的格式

图像格式主要分为位图和矢量图，下面分别阐述他们的特点：

位图：

1.主要格式：jpg，png，gif；

2.jpg主要用于色彩丰富的场景，png可以包含透明信息，属于32位图，另外8位是透明信息，是网页设计的专用格式，gif可以做逐帧动画；

3.位图有8、16、24、32四种，其中8位是灰度图，24位是彩色图，32为包括了透明信息；

4.位图在放大过程中会降低质量；

5.主要绘图工具；adobe公司的photoshop，windows自带画图工具

矢量图：

1.主要格式是ai，cdf，fh，swf；

2.矢量图组成是数学向量；

3.主要用在印刷业，放大不会失真；

4.主要绘图工具：Adobe公司的illustrator，Corel公司的CorelDRAW。
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航