论坛交流
首页办公自动化| 网页制作| 平面设计| 动画制作| 数据库开发| 程序设计| 全部视频教程
应用视频: Windows | Word2007 | Excel2007 | PowerPoint2007 | Dreamweaver 8 | Fireworks 8 | Flash 8 | Photoshop cs | CorelDraw 12
编程视频: C语言视频教程 | HTML | Div+Css布局 | Javascript | Access数据库 | Asp | Sql Server数据库Asp.net  | Flash AS
当前位置 > 文字教程 > HTML教程
Tag:初学,入门,文字,链接,table,表单,框加,多媒体,标签,视频教程

XHTML网页图片应用

文章类别:HTML | 发表日期:2010-9-9 10:11:31

合理的添加图片可以使一个网页更加的美观。

图片标签<img>
<img>标签用于在网页里插入图片。<img>标签有一个重要的属性"src",它的属性值就是图片的地址。下面我们就在我们的index.html里插入一个图片。打开”index.html“文件,在</body>前加上如下代码:

<p><img src="http://www.webjx.com/images/logo.gif" alt="技术支持"/></p>


保存后浏览网,请确认您的网页与该页面相同。

我们注意到<img>是一个空标签,需要在结尾加上一个"/"以符合XHTML的要求。这里的例子除src外还有一个属性alt,我们把它叫做做替换属性,当图片由于某种原因而无法显示的时候,alt的属性值就会代替图片出现;而当图片正常显示时,只要把鼠标停在图片上就会看到alt属性的属性值。

用图片作为链接
我们在之前的教程中曾经学习过创建超级链接,下面我们打开“index.html”并且将刚插入的代码改为下面这段:

<p><a href="http://www.webjx.com/"><img src="http://www.webjx.com/images/logo.gif"alt="技术支持"/></a></p>


保存后浏览网页,请再次确认您的网页与这个网页相同。看看图片是不是变成了超级链接,点击一下图片就会进入菜鸟吧的主页了。

关于XHTML的效验
从本节开始我们就不再修改"index.html"这个网页的外观了,现在将我们制作的网页送交权威机构检验一下。首先进入:http://validator.w3.org/,该页面就是一个XHTML效验工具,它用来检验我们制作的网页是否符合XHTML的标准。您可以选择用网址效验,也可以上传文件效验。您可以选择文件上传效验,方法如下:

在”Validate by File Upload“有“Local File”一栏,点击浏览,找到并选中之前保存的"index.html",然后点击“check”按钮。您的结果应该与我们通过网址效验的结果一样。返回如下错误信息:

Sorry, I am unable to validate this document because on line 3, 6-9, 12-14, 16-22 it contained one or more bytes that I cannot interpret as utf-8 (in other words, the bytes found are not valid values in the specified Character Encoding). Please check both the content of the file and the character encoding indication. 

 

 
上一篇:XHTML列表标签的使用 人气:2027
下一篇:表格边框的css语法 人气:2045
视频教程列表
文章教程搜索
 
HTML推荐教程
HTML热门教程
看全部视频教程
购买方式/价格
购买视频教程: 咨询客服
tel:15972130058