charset=gb2312">CSS实现文字底部对齐txt{height:246px;width:512px;border:1pxsolid000000;position:relative}txtp{position:absolute;bottom:0px;padding:0px;margin:0px}网页特效XXX ul li{ min-height:xxx; min-width:xxx display:block; padding-top:xxx}蒙的呵呵。。没试过 同样很想知道怎么弄...
css如何设定实现li中内容底部对齐？
1.简单的静态页面 如果仅仅是几个图片的话就放到一个表格中 然后对其方式 垂直对其 选中底部
2.对于动态网页 也就是图片不固定的 可以吧一个图片和下面的文字放到一个Div中 然后 div的属性设float=left 这样在一个div中就可以很灵活的控制了 对于第二种方法不好调间距 你可以先为div加上边框 然后效果满意了 就把边框去了
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>CSS实现文字底部对齐</title>
<style type="text/css">
#txt{
height:246px;
width:512px;
border:1px solid #000000;
position:relative
}
#txt p{
position:absolute;
bottom:0px;
padding:0px;
margin:0px
}
</style>
</head>
<body>
<div id="txt">
<p><a href="#" target="_blank">网页特效</a></p>
</div>
</body>
</html>2015-12-12
直接用li+css可以实现 但是效果不好 以为不灵活
对于这种情况可做如下处理：
1.简单的静态页面 如果仅仅是几个图片的话就放到一个表格中 然后对其方式 垂直对其 选中底部
2.对于动态网页 也就是图片不固定的
可以吧一个图片和下面的文字放到一个Div中 然后 div的属性设float=left 这样在一个div中就可以很灵活的控制了
对于第二种方法不好调间距 你可以先为div加上边框 然后效果满意了 就把边框去了2010-03-03
应该有用到JS的，至少图片截取这里有用到，观察可以看见图片宽度是一定的，还有文字那边应该是统一高度的我猜，下面是我的代码，主要就是li的底部对齐实现，关键代码display:inline-block;vertical-align:bottom;不想兼容，标准浏览器是可以有效果的IE8也可以应该，其实还有很多细节要考虑的，比如标签的选择和组合...因为懒，所以 - -
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="
http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<style type="text/css">
<!--
*{margin:0;padding:0}
ul{list-style:none;border:1px solid #ccc;width:500px;margin:50px auto;
}
li{display:inline-block;vertical-align:bottom;}
div{width:90px;overflow:hidden;border:1px solid #ccc;text-align:center;padding:4px;}
p{width:90px;overflow:hidden;}
span{display:block;text-align:center;height:30px;overflow:hidden;background-color:lime;}
-->
</style>
</head>
<body>
<ul>
<li>
<div><p><img src="" alt="" /></p></div>
<span>文字说明文字说明文字说明文字说明</span><!--文字层应该有一个高度的我猜-->
</li>
<li>
<div><p><img src="" alt="" /></p></div>
<span>文字说明</span>
</li>
<li>
<div><p><img src="" alt="" /></p></div>
<span>文字说明</span>
</li>
</ul>
</body>
</html>2010-03-17
1.简单的静态页面
如果仅仅是几个图片的话就放到一个表格中
然后对其方式
垂直对其
选中底部
2.对于动态网页
也就是图片不固定的
可以吧一个图片和下面的文字放到一个Div中
然后
div的属性设float=left
这样在一个div中就可以很灵活的控制了
对于第二种方法不好调间距
你可以先为div加上边框
然后效果满意了
就把边框去了
<html>
<head>
<meta
http-equiv="Content-Type"
content="text/html;
charset=gb2312">
<title>CSS实现文字底部对齐</title>
<style
type="text/css">
#txt{
height:246px;
width:512px;
border:1px
solid
#000000;
position:relative
}
#txt
p{
position:absolute;
bottom:0px;
padding:0px;
margin:0px
}
</style>
</head>
<body>
<div
id="txt">
<p><a
href="#"
target="_blank">网页特效</a></p>
</div>
</body>
</html>2020-06-06
<ul>
<li valign="bottom"><img src="inages/aa.jpg"></li>
</ul>2010-03-03
XXX ul li{ min-height:xxx; min-width:xxx display:block; padding-top:xxx}
蒙的呵呵。。没试过 同样很想知道怎么弄的2010-03-04
hi我2010-03-03
cssli居中 cssfloat居中 
