当前位置：首页 > 资讯 > 技术文档

用xhtml+css写的相册自适应 - 类似九宫格[兼容　ff ie6 ie7 opear ]

时间：2020-12-31 17:45 编辑：来源：阅读：
扫一扫，手机访问

摘要：用xhtml+css写的相册自适应 - 类似九宫格[兼容　ff ie6 ie7 opear ]

[img]http://bbs.blueidea.com/attachments/2007/5/19/20070519_26707fa407132ea176d6MkdEZM9IABti.gif[/img]

[b]功能：[/b]

1.图片可以缩放，外框也随之变动。

2.图片缩放后，居底对齐。

3.鼠标滑上去，边框有虚线。

[b]结构：[/b]

[img]http://bbs.blueidea.com/attachments/2007/5/19/20070519_50b43c575212e5b4b601sOWbnXxVHfW4.gif[/img]

[b]源代码：[/b]

<meta content="text/html; charset=utf-8" http-equiv="Content-Type"></meta> 
<meta content="mapbar" name="description"></meta> 
<meta content="mapbar" name="keywords"></meta> 
<meta content="www.mapbar.com" name="author"></meta> 
<meta content="all" name="robots"></meta> 
相册自适应写法

<div class="sideBlock" onmouseout="g_b_ccn (this, 'borderColorNone', 'borderColor');" onmouseover="g_b_ccn (this, 'borderColor', 'borderColorNone');"> 
<table border="0" cellpadding="0" cellspacing="0" width="100%"> 
           <tr> 
             <td align="center" valign="bottom"> 
 
<div class="t2"> 
            
           <div class="b2"> 
             
            <div class="t1">[img]http://hiphotos.baidu.com/ouhee/pic/item/2fc52efa66a32c8c9f514652.jpg[/img]
</img></div> 
    
             
            <div class="m1"> 
              
             <div class="m2"> 
              [img]http://hiphotos.baidu.com/ouhee/pic/item/56f64282bae68ba70df4d27d.jpg[/img]
</img> 
             </div> 
            </div> 
             
            <div class="b1"> 
             [img]http://hiphotos.baidu.com/ouhee/pic/item/f731cccaa4a65d43f31fe752.jpg[/img]
</img> 
            </div> 
    
           </div> 
</div> 
</td> 
           </tr> 
</table> 
[url=http://www.1sucai.cn/article/10013.htm#]底部底部边边[/url]
 
底部底部边边
 
底部底部边边
 
</div>

[Ctrl+A 全选注:[url=http://www.1sucai.cn/article/23421.htm]如需引入外部Js需刷新才能执行[/url]]

全部评论(0)

上一篇：js 获取和设置css3 属性值的实现方法
下一篇：JavaScript关闭当前页面(窗口)不带任何提示

资讯排行榜
更多>>

用xhtml+css写的相册自适应 - 类似九宫格[兼容 ff ie6 ie7 opear ]

用xhtml+css写的相册自适应 - 类似九宫格[兼容　ff ie6 ie7 opear ]