HTML 图像
图像标签<img;>: 空标签,只包含属性,没有闭合标签 源属性<Src;>
<img src="url />
替换文本属性<Alt>: 为图像定义一串预备的可替换的文本。值是用户定义的。
<img src="boat.gif" alt="Big Boat">
实例1. 背景图像
<html><body background="/i/eg_background.jpg"></body></html>
实例2. 排列图片
<html><body><h2>Without align:</h2><p>Image <img src="/i/eg_cute.gif"> in the text</p><h2> With align: </h2><p>Image <img src="/i/eg_cute.gif" align="bottom"> in the text</p><p>Image <img src="/i/eg_cute.gif" align="middle"> in the text</p><p>Image <img src="/i/eg_cute.gif" align="top"> in the text</p><p>bottom是默认的对齐方式</p></body></html>
实例3. 浮动图像
<p><img src="/i/eg_cute.gif" align="left">带有图像的一个段落。图像的align属性设置为"left", 图像将浮动到文本的左侧</p><p><img src="/i/eg_cute.gif" align="right">...右侧</p>
实例4. 调整图像的尺寸
<img src="/i/eg_mouse.jpg" width="50" height="50"><br /><img src="/i/eg_mouse.jpg" width="100" height="100"><br /><img src="/i/eg_mouse.jpg" width="200" height="200">
实例5. 制作图像链接
<a href="/example/html/lastpage.html"><img border="0" src="/i/eg_buttonnext.gif" /></a>
实例6. 创建图像映射
<p>请点击图像上的星球,把它们放大。</p><imgsrc="/i/eg_planets.jpg"border="0" usemap="#planetmap"alt="Planets" /><map name="planetmap" id="planetmap"><areashape="circle"coords="180,139,14"href ="/example/html/venus.html"target ="_blank"alt="Venus" /><areashape="circle"coords="129,161,10"href ="/example/html/mercur.html"target ="_blank"alt="Mercury" /><areashape="rect"coords="0,0,110,260"href ="/example/html/sun.html"target ="_blank"alt="Sun" /></map><p><b>注释:</b>img 元素中的 "usemap" 属性引用 map 元素中的 "id" 或 "name" 属性(根据浏览器),所以我们同时向 map 元素添加了 "id" 和 "name" 属性。</p>
实例7. 把图像转换为图像映射
<p>请把鼠标移动到图像上,看一下状态栏的坐标如何变化</p><p><a href="/examp/html/html_ismap.html"><img src="/i/eg_planets.jpg" ismap /></a></p>
HTML 背景
背景颜色(bgcolor)<body bgcolor="#000000"><body bgcolor="rgb(0,0,0)"><body bgcolor="black">背景(background)<body background="clouds.gif"> (相对地址)<body backgroudn="/clouds.gif">(绝对地址)使用背景图片时注意图像文件不应超过10k背景图片是否与页面中的其他图像搭配良好是否与文字颜色搭配良好平铺后看上去怎样对文字的注意力被背景图像喧宾夺主了吗?注意:<body> 标签中的背景颜色(bgcolor)、背景(background)和文本(text)属性在最新的 HTML 标准(HTML4 和 XHTML)中已被废弃。W3C 在他们的推荐标准中已删除这些属性。
应该使用层叠样式表(CSS)来定义 HTML 元素的布局和显示属性。
HTML 颜色1. 颜色值:
2. 颜色名:
大多数的浏览器都支持颜色名集合。
提示:仅仅有 16 种颜色名被 W3C 的 HTML4.0 标准所支持。它们是:aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, yellow。
如果需要使用其它的颜色,需要使用十六进制的颜色值。
3. Web安全色
数年以前,当大多数计算机仅支持 256 种颜色的时候,一系列 216 种 Web 安全色作为 Web 标准被建议使用。其中的原因是,微软和 Mac 操作系统使用了 40 种不同的保留的固定系统颜色(双方大约各使用 20 种)。
我们不确定如今这么做的意义有多大,因为越来越多的计算机有能力处理数百万种颜色,不过做选择还是你自己。
216 跨平台色
最初,216 跨平台 web 安全色被用来确保:当计算机使用 256 色调色板时,所有的计算机能够正确地显示所有的颜色。