html – 垂直对齐内联块列表项中的内容

html – 垂直对齐内联块列表项中的内容,第1张

概述我正试图水平显示无序列表.在每个列表项中,我有一个带有图像的锚标记,我想在列表项中垂直对齐显示.这是我的 HTML: <ul> <li> <a href="#"> <img src="1.jpg" alt="" height="50" width="50" /> </a> </li> <li> <a h 我正试图水平显示无序列表.在每个列表项中,我有一个带有图像的锚标记,我想在列表项中垂直对齐显示.这是我的

HTML:

<ul>    <li>        <a href="#">            <img src="1.jpg" alt="" height="50" wIDth="50" />        </a>    </li>    <li>        <a href="#">            <img src="2.jpg" alt="" height="50" wIDth="50" />        </a>    </li>    <li>        <a href="#">            <img src="3.jpg" alt="" height="50" wIDth="50" />        </a>    </li></ul>

CSS:

ul{    margin: 0;    padding: 0;    List-style: none;    height: 93px;}ul li{    display: inline-block;    wIDth: 110px;    height: 93px;    text-align: center;    vertical-align: mIDdle;}

我在这做错了什么?

解决方法 http://jsfiddle.net/zgxHB/1/

尝试使用display:table-cell;而不是显示:inline-block;

总结

以上是内存溢出为你收集整理的html – 垂直对齐内联块列表项中的内容全部内容,希望文章能够帮你解决html – 垂直对齐内联块列表项中的内容所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1137523.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-30
下一篇 2022-05-30

发表评论

登录后才能评论

评论列表(0条)

保存