html中怎么在li中加图片,如何让li里的图片垂直居中

如何让li里的图片垂直居中？

111111

222222

别用display:table之类的啊，那样一个li占了一个大的单元格那么大的地方，无法和图片li紧贴在一起了。

回复讨论(解决方案)

.box {

/*非IE的主流浏览器识别的垂直居中的方法*/

display: table-cell;

vertical-align:middle;

/*设置水平居中*/

text-align:center;

/* 针对IE的Hack */

*display: block;

*font-size:262px;

/*约为高度的0.873，300*0.873 约为262*/

*font-family:Arial;

/*防止非utf-8引起的hack失效问题，如gbk编码*/

width:400px; height:300px; border:1px solid #eee;

}

.box img {

/*设置图片垂直居中*/

vertical-align:middle;

}

需要图片居中是不是相对于li前面的小圆点的相对居中。如果是的话可以尝试我下面的写法：.psdthumb2 ul{list-style:none}

.psdthumb2 ul li{background:url(xxxx.jpg) no-repeat left center;

padding-left:(这里的数值跟前面的图片宽度有关系)px}

思路就是替换 li 前面的小圆点并使其永远上下居中。

你这个貌似不是针对li的，下面是完整的html，你能编辑一下吗？/p>

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

.psdthumb2 ul {

list-style: none;

}

li.qq2{

height: 400px;

width: 400px;

background-color: red;

}

111111

222222

或者可以尝试用

将你要居中的东西圈起来，比如/p>

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

.psdthumb2 ul {

list-style: none;

}

li.qq2{

height: 400px;

width: 400px;

background-color: red;

position:relative;

}

img{

position:absolute;

left:50%;

top:50%;

}

#q1{

margin-left:-22px;

margin-top:-21px;

}

#q2{

margin-left:-50px;

margin-top:-50px;

}

111111

222222

以上就是如何让li里的图片垂直居中的内容，更多相关内容请关注PHP中文网(www.php.cn)！

声明：本文原创发布php中文网，转载请注明出处，感谢您的尊重！如有疑问，请联系admin@php.cn处理

html中怎么在li中加图片,如何让li里的图片垂直居中相关推荐

wps中图片怎么居中_wps2010里插入图片如何使图片居中啊！
展开全部 wps2010里插入图片使图片居中的方法如下: 1.首先,打开"WPS文字",新建一个空白文档.然后,62616964757a686964616fe4b893e5b19e ...
图片优化_网站里的图片应该如何优化
我们一直都在做网站关键词.内页关键词.标签等.但很多朋友都忽略了网站里的图片如何优化.近年来百度图片识别.360图片识别都在不断升级功能上已经很完善了,所以我们应该对网站图片进行优化,应该做seo的朋 ...
android 图片加密,安卓手机里的图片怎么加密
我们先要下载安装好我们的360手机安全卫士!我们就用安卓市场软件来把360手机安全卫士下载到我们的手机吧!点击进入搜索界面,在搜索栏上输入"360"然后点击搜索按钮!在新的页面下, ...
thinkphp用phpexcel读取excel,并修改列中的值，再导出excel,带往excel里写入图片
<?phpclass GetpriceAction extends AdministratorAction {// 文件保存路径protected $savepath; // 允许上传的文件类型 ...
SpringCloud工作笔记067---消息推送_推送视频_推送图片_在通知栏里显示图片视频_自定义点击消息后的动作
JAVA技术交流QQ群:170933152 http://docs.getui.com/getui/server/java/template/ 个推 ,这里有文档,看看就能搞,另外: 在hbuilde ...
又见灵异事件，li中的span右浮动遇到的问题
最新又见灵异事件,li中的span右浮动遇到的问题以下是三零网为大家整理的最新又见灵异事件,li中的span右浮动遇到的问题的文章,希望大家能够喜欢! 新闻列表中为了显示时间,加了个span < ...
[html] img中的src加载失败时如何用默认图片来替换呢？
[html] img中的src加载失败时如何用默认图片来替换呢? img有onerror属性,加载失败时触发error事件但是这种解决方法在error里面替换的默认图片也加载失败的时候会导致问题,需 ...
php中怎么给文字加颜色,PHP水印类,支持添加图片、文字、填充颜色区域的实现...
*自己整理的一个水印类* 支持添加图片.文字.填充颜色区域 /** * 图片加水印类,支持文字水印.透明度设置.自定义水印位置等. * 使用示例: * $obj = new WaterMask($im ...
用html设置页面中有的多张图片大小,页面加载性能之使用正确的图片尺寸
我们总是会忘记缩小图片尺寸,直接应用到项目中.这种图片看上去很正常,但实际上既浪费了用户的流量,也影响了页面性能. 找出不正确尺寸的图片 Lighthouse是首选,执行一下Performance A ...

html中怎么在li中加图片,如何让li里的图片垂直居中

html中怎么在li中加图片,如何让li里的图片垂直居中相关推荐

最新文章

热门文章