项目一任务二 制作“景泰蓝”页面

非遗文化长廊制作“景泰蓝”页面CONTENTS目录网页中的图片格式第一部分图像标签及属性第二部分绝对路径和相对路径第三部分CONTENTS目录锚点链接第四部分网页中的图片格式第一部分HTML5基础知识目前网页上常用的图像格式主要有GIF、PNG和JPG三种。GIFPNGJPG1.无损压缩，图片质量高；2.限制在256色以内；3.浏览器广泛兼容。1.无损压缩，高度保真；2.支持24位真彩色和透明背景；3.算法高效，文件大小适中。1.有损压缩；2.不支持透明背景；3.广泛应用于在网页图像、摄影作品和数字媒体中。图像标签及属性第二部分图像标签及属性HTML中图像标签为：<img>图像标签及属性1.alt属性允许开发者自行定义描述性文字浏览器无法正常加载时，显示该文字保证了信息的连续性图像标签及属性2.title属性提供图像的描述性文字帮助用户理解点击链接后将访问的内容title属性也常用于为图片等视觉元素添加额外的说明图像标签及属性3.width属性和height属性width属性和height属性允许自定义图片大小。设置其中一个属性，另一个属性将自动调整以保持图片的原始宽高比。图像标签及属性4.border属性使用border属性来指定边框的宽度；border属性本身不提供设置边框颜色的功能；通过CSS来自定义边框的颜色、样式和半径等。图像标签及属性5.vspace属性和hspace属性vspace属性用于控制图片上下的边距，而hspace属性用于控制图片左右的边距。随着网页设计的发展和HTML5的推出，vspace和hspace属性已不再推荐使用。推荐使用CSS来控制元素的边距。图像标签及属性6.align属性

调整图片的对齐方式leftrightmiddletopbottom绝对路径与相对路径第三部分绝对路径与相对路径相对路径文件系统文件系统中用来指定文件位置的两种不同方式绝对路径绝对路径与相对路径绝对路径是从文件系统的最高层级（根目录）开始，到目标文件或目录的完整路径描述。例如：C:\Users\Username\Documents绝对路径绝对路径与相对路径相对路径某个目录指相对某个目录而言一个路径的位置相对路径当前目录THEFUTUREOF相对路径和绝对路径Windows系统中的文件目录【例】假设存在一个如图所示的多级目录C：HTMLWindowsProgramFilesImagesFiles景泰蓝.jpgphoto.jpg相对路径和绝对路径Windows系统中的文件目录【例】假设当前目录是“C:\HTML\Images”下有一个文件“景泰蓝.jpg”C：HTMLWindowsProgramFilesImagesFiles景泰蓝.jpgphoto.jpg采用相对路径的表示方法是→

.\景泰蓝.jpg“.\”指的是当前目录相对路径和绝对路径Windows系统中的文件目录C:\HTML\Images可用“..\”表示除了使用“.\”表示当前目录以外，还可以使用“..\”表示当前目录的上一级目录相对路径和绝对路径Windows系统中的文件目录C:\HTML\Images可用“..\”表示“..\”还可以连用，比如当前目录是“C:\Python38\mycode”，则“..\..\”就表示“C:\”锚点链接第四部分锚点链接<ahref=”目标地址”>链接文本</a>超链接锚点链接锚点链接是HTML中一种创建页面内跳转的链接方式，它允许用户点击链接后，页面会滚动到指定的锚点位置，而不是跳转到另一个页面。锚点链接锚点链接通过使用HTML的<a>标签，并设置