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中内容底部对齐?

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
mengvlog 阅读 33 次 更新于 2025-08-06 21:02:19 我来答关注问题0
  • 下面是我的代码,主要就是li的底部对齐实现,关键代码display:inline-block;vertical-align:bottom;不想兼容,标准浏览器是可以有效果的IE8也可以应该,其实还有很多细节要考虑的,比如标签的选择和组合...因为懒,

  • 一、CSS中li元素居中 水平居中:若li元素是块级元素或者设置为块级显示(display: block或display: inline-block),可以使用margin: 0 auto;来实现水平居中。但前提是li元素的父容器需要有一个明确的宽度。另一种方法是使用flexbox布局,将父容器设置为display: flex;,然后使用justify-content: center;...

  • 1、首先,打开html编辑器,新建html文件,例如:index.html。2、在index.html中的标签中,输入css代码:li{width: 100px; white-space: nowrap;overflow: hidden;}。3、浏览器运行index.html页面,此时标签中超出的文字被隐藏了。

  •  lewie_ css html 这种样式如何实现 li 下

    设置LI的底边框为黑色,然后把这几个LI都左浮动,这样它们就贴在一起了,连成一条底线,然后LI:HOVER的时候,给LI加上背景图片和改变LI的底框颜色跟你图片的一样就可以了。。也可以通过LI里加一个A,DISPLAY:BLOCK后,给它MARGIN-BOTTOM:-1PX来盖住原来线,也可以给它们做定位,,这些都行得通。。

  •  猪八戒网 DIVCSSLI里面怎么让垂直的文字垂直居中_div设置文字水平纵向居中

    1、首先打开hbuilder软件,新建一盒html文件,写入一个外围的div容器标签,div中设置一个span标签:2、然后在上方设置style标签,在里面设置div的字体,高度和宽度以及背景颜色的属性,同时设置div的display属性为table-cell,将它设置为表格元素,然后设置纵向对齐方式vertical-align属性为中间居中,在span标签中...

檬味博客在线解答立即免费咨询

CSS相关话题

Copyright © 2023 WWW.MENGVLOG.COM - 檬味博客
返回顶部