HTML – 如何垂直居中图像旁边的文字？

概述参见英文答案 > Vertically align text next to an image?                                    20个 我有以下代码,我想将文本垂直居中放在图像旁边. .section_content { width: 400px;}.section_content > ul > li > img { width: 40 参见英文答案 > Vertically align text next to an image?                                    20个
我有以下代码,我想将文本垂直居中放在图像旁边.

.section_content {    wIDth: 400px;}.section_content > ul > li > img {    wIDth: 40px;    height: 40px;    padding: 5px;}.section_content > ul > li > a {    vertical-align: top;}.section_content > ul > li {    List-style-type: none;}.section_content > ul {    List-style-type: none;    padding-top: 45px;    padding-left: 5px;}

<div >        <ul>            <li><img src="img/linkedin.svg"><a href="https://be.linkedin.com/in/lel">linkedIn</a></li>            <li>GitHUb</li>        </ul>    </div>

解决方法 你有垂直对齐：顶部在那里;你想要的是垂直对齐：中间,链接和它应该坐在旁边的图像.

.section_content {    wIDth: 400px;}.section_content > ul > li > img {    wIDth: 40px;    height: 40px;    padding: 5px;}.section_content > ul > li > a,.section_content > ul > li img {    vertical-align: mIDdle;}.section_content > ul > li {    List-style-type: none;}.section_content > ul {    List-style-type: none;    padding-top: 45px;    padding-left: 5px;}

<div >        <ul>            <li><img src="img/linkedin.svg"><a href="https://be.linkedin.com/in/lel">linkedIn</a></li>            <li>GitHUb</li>        </ul>    </div>

总结

以上是内存溢出为你收集整理的HTML – 如何垂直居中图像旁边的文字？全部内容，希望文章能够帮你解决HTML – 如何垂直居中图像旁边的文字？所遇到的程序开发问题。

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