用js 让图片在 div或dl里 居中,底部对齐_Javascript教程-查字典教程网
用js 让图片在 div或dl里 居中,底部对齐
用js 让图片在 div或dl里 居中,底部对齐
发布时间:2016-12-30 来源:查字典编辑
摘要:解决图片长宽大于容器,一边长一边宽,小于容器在ff,ie里都通过这里是js代码:复制代码代码如下:查字典教程网jiaocheng.chazi...

解决图片长宽大于容器,一边长一边宽,小于容器

在ff,ie里都通过

这里是js代码:

复制代码 代码如下:

<HTML>

<HEAD>

<TITLE>查字典教程网jiaocheng.chazidian.comNewDocument</TITLE>

<METANAME="Generator"CONTENT="EditPlus">

<METANAME="Author"CONTENT="">

<METANAME="Keywords"CONTENT="">

<METANAME="Description"CONTENT="">

<styletype="text/css">

*{margin:0px;padding:0px;font-size:12px;}

body{font-size:0.8em;color:#333;}

ul{list-style:none}

.clear:after{

content:".";

display:block;

height:0;

clear:both;

visibility:hidden;}

img{border:0px;}

.clear1{clear:both;width:100%;height:1px;overflow:hidden;}

a{text-decoration:none;color:#404040}

body{background:#f7f3d0url(../images/bg.jpg)repeat-xleft210px;}

/**/

#pic{border:1pxsolid#000;width:800px;height:auto!important;height:300px;min-height:300px;background:#fff}

#picdl{width:215px;height:200px;overflow:hidden;border:1pxsolid#000;margin:10px;float:left}

#picdt{height:161px;width:209px;overflow:hidden;border:1pxsolidred;text-align:center}

</style>

<scriptlanguage="javascript"src="tt.js"></script>

<scriptlanguage="javascript">

<>

</script>

</HEAD>

<BODY>

<divid="pic">

<dl>

<dt><ahref="images/_1.jpg"title=""><imgsrc="images/_1.jpg"border=0alt=""title=""></a></dt>

<dd>图片1</dd>

</dl>

<dl>

<dt><ahref="images/_2.jpg"title=""><imgsrc="images/_2.jpg"border=0alt=""title=""></a></dt>

<dd>图片1</dd>

</dl>

<dl>

<dt><ahref="images/_3.jpg"title=""><imgsrc="images/_3.jpg"border=0alt=""title=""></a></dt>

<dd>图片1</dd>

</dl>

<dl>

<dt><ahref="images/_4.jpg"title=""><imgsrc="images/_4.jpg"border=0alt=""title=""></a></dt>

<dd>图片1</dd>

</dl>

<dl>

<dt><ahref="images/_5.jpg"title=""><imgsrc="images/_5.jpg"border=0alt=""title=""></a></dt>

<dd>图片1</dd>

</dl>

<dl>

<dt><ahref="images/_6.jpg"title=""><imgsrc="images/_6.jpg"border=0alt=""title=""></a></dt>

<dd>图片1</dd>

</dl>

<dl>

<dt><ahref="images/_1.jpg"title=""><imgsrc="images/_1.jpg"border=0alt=""title=""></a></dt>

<dd>图片1</dd>

</dl>

<dl>

<dt><ahref="images/_2.jpg"title=""><imgsrc="images/_2.jpg"border=0alt=""title=""></a></dt>

<dd>图片1</dd>

</dl>

<dl>

<dt><ahref="images/_3.jpg"title=""><imgsrc="images/_3.jpg"border=0alt=""title=""></a></dt>

<dd>图片1</dd>

</dl>

<dl>

<dt><ahref="images/_4.jpg"title=""><imgsrc="images/_4.jpg"border=0alt=""title=""></a></dt>

<dd>图片1</dd>

</dl>

<dl>

<dt><ahref="images/_5.jpg"title=""><imgsrc="images/_5.jpg"border=0alt=""title=""></a></dt>

<dd>图片1</dd>

</dl>

<dl>

<dt><ahref="images/_6.jpg"title=""><imgsrc="images/_6.jpg"border=0alt=""title=""></a></dt>

<dd>图片1</dd>

</dl>

<divclass="clear1"></div>

</div>

</BODY>

</HTML>

包太大上传不了,我把html文件放上来,自己放图片看看就行了

相关阅读
推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
  • 大家都在看
  • 小编推荐
  • 猜你喜欢
  • 最新Javascript教程学习
    热门Javascript教程学习
    编程开发子分类