无忧公告:  建站无忧一号群开放:群号:46305815 一起讨论建站时所遇到的问题。   
内容搜索: 标题内容作者
背景: #EDF0F5 #FAFBE6 #FFF2E2 #FDE6E0 #F3FFE1 #DAFAF3 #EAEAEF 默认  
阅读新闻

HTML入门之十一(HTML图像)

[日期:2007-12-31] 来源:http://www.jzwy.net  作者:本站站长 [字体: ]
使用HTML可以在文档中显示图像。



示例

插入图像:



这个例子说明了如何在网页中显示图像。


插入非本地图像:



这个例子说明了如何在网页中显示非本地图像。


在这个页面的底部,还有更多例子。



Img标签和src属性

在HTML里面,图像是由<img>标签定义的。

<img>是空标签,意思是说,它只拥有属性,而没有结束标签。

想要在页面上显示一个图像,需要使用src属性。“src”表示“源”的意思。“src”属性的值是所要显示图像的URL。

插入图像的语法:

<img src="url">

URL指向图像存储的地址。网站“www.w3schools.com”子目录“images”中的图像“boat.gif”的URL如下: “http://www.w3schools.com/images/boat.gif”。

当浏览器在文档中遇到img标签时,就放置一个图像。如果把img标签放在两个段落之间,就会先显示一个段落,然后是这个图像,最后是另外一个段落。



alt属性

alt属性用来给图像显示一个“交互文本”。alt属性的值是由用户定义的。

<img src="../../boat.gif" alt="Big Boat">

“alt”属性在浏览器装载图像失败的时候告诉用户所丢失的信息,此时,浏览器显示这个“交互文本”来代替图像。给页面上的图像都加上alt属性是一个好习惯,它有助于更好地显示信息,而且,对纯文本浏览器很有用。



基本注意点——有用的技巧

如果一个HTML文档包含10个图像,那么为了正确显示这个页面,需要加载11个文件。加载图像是需要时间的,所以请谨慎使用图像。



更多示例:

背景图像:


这个例子说明了在HTML页面中如何添加背景图像。


对齐图像:


这个例子说明了在文字中如何对齐图像。


浮动图像:


这个例子说明了如何让图像浮动在段落的旁边。


调整图像大小:


这个例子说明了如何改变图像的大小。


图像的交互文本:


这个例子说明了如何为图像创建交互文本。将鼠标放在图像上,将能够看到这个文本。


图像链接:


这个例子说明了如何使用图像作为链接。


图像地图:


这个例子说明了如何创建带有可点击区域的图像地图。每个可点击区域是一个超级链接。


将图像转化为图像地图:


这个例子说明了如何将图像转化为图像地图。将鼠标在图像上移动,状态栏将显示坐标。
阅读:
录入:无忧

推荐 】 【 打印
相关新闻      
本文评论       全部评论
发表评论


点评: 字数
姓名:

  • 尊重网上道德,遵守中华人民共和国的各项有关法律法规
  • 承担一切因您的行为而直接或间接导致的民事或刑事法律责任
  • 本站管理人员有权保留或删除其管辖留言中的任意内容
  • 本站有权在网站内转载或引用您的评论
  • 参与本评论即表明您已经阅读并接受上述条款