<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> |
< html > |
< head > |
< title >表格图片超链接练习</ title > |
</ head > |
< body > |
<!-- |
需求:在页面上显示多张图片,对图片进行简单个格式化,每个图片都可以变成超链接的形式,当点击图片的时候,打开一个新的资源 |
分析:页面上有多张图片,肯定有多个img标签 |
要对页面的图片进行简单的格式化,需要使用表格来进行格式化 |
一行显示4张图片 |
--> |
< table > |
< tr > |
< td > |
< a href = "http://sh.itcast.cn" >< img alt = "" src = "img/1.jpg" width = "100" height = "150" ></ a > |
</ td > |
< td > |
< a href = "http://baidu.com" >< img alt = "" src = "img/1.jpg" width = "100" height = "150" ></ a > |
</ td > |
< td > |
< a href = "http://sina.com.cn" >< img alt = "" src = "img/1.jpg" width = "100" height = "150" ></ a > |
</ td > |
< td > |
< a href = "http://qq.com" >< img alt = "" src = "img/1.jpg" width = "100" height = "150" ></ a > |
</ td > |
</ tr > |
< tr > |
< td > |
< img alt = "" src = "img/1.jpg" width = "100" height = "150" > |
</ td > |
< td > |
< img alt = "" src = "img/1.jpg" width = "100" height = "150" > |
</ td > |
< td > |
< img alt = "" src = "img/1.jpg" width = "100" height = "150" > |
</ td > |
< td > |
< img alt = "" src = "img/1.jpg" width = "100" height = "150" > |
</ td > |
</ tr > |
< tr > |
< td > |
< a href = "http://sh.itcast.cn" >< img alt = "" src = "img/1.jpg" width = "100" height = "150" ></ a > |
</ td > |
< td > |
< img alt = "" src = "img/1.jpg" width = "100" height = "150" > |
</ td > |
< td > |
< img alt = "" src = "img/1.jpg" width = "100" height = "150" > |
</ td > |
< td > |
< img alt = "" src = "img/1.jpg" width = "100" height = "150" > |
</ td > |
</ tr > |
</ table > |
|
< a href = "mailto:itcast@itcast?cc=xx@yy.cn" >联系我们</ a > |
< a href = "thunder:xxxaaajsdlkfjlksdjf.avi" >下载葵花宝典</ a > |
< a href = "javascript:void(0)" onclick = "alert('你还真点击啊')" >点击</ a > |
|
|
|
</ body > |
</ html > |