icon和文本垂直居中对齐

最新推荐文章于 2023-03-27 15:37:31 发布

楚念悠

最新推荐文章于 2023-03-27 15:37:31 发布

阅读量6.9k

点赞数

文章标签：垂直居中

本文链接：https://blog.youkuaiyun.com/jpjp2020/article/details/82222071

版权

博客提及了垂直居中的效果，但未给出更多详细信息。垂直居中在前端开发中是常见需求，能提升页面布局的美观度和用户体验。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

效果

<div class="more">
    <a href="javascript:more();">
        <i class="iconfont1 icon-jiahao"></i>
        <span>加载更多</span>
    </a>
</div>

.more {
	display: block;
	width: 100%;
    height: 36px;
	margin: 0 auto;
	text-align: center;	
	color: #999;
}

.more a {
    display: inline-block;
	height: 36px;
    line-height: 36px;
	font-size: 15px;
	color: #666;
	border-radius: 4px;
	text-decoration: none;
}

.icon-jiahao {
	display: inline-block;
    float:  left;
    height: 100%;
    margin-right: 5px;
    margin-top: 0;
    line-height: 36px;
	font-size: 18px;
	vertical-align: middle;
	box-sizing:  border-box;	
}