gpt4 book ai didi

html - 如何居中 Sprite 图片和文字?

转载 作者:太空宇宙 更新时间:2023-11-04 03:50:20 25 4
gpt4 key购买 nike

我正在使用 CSS Sprite 。我有一个简单的图像和一个文本。我想在页面中央显示图像,文本垂直居中显示在该图像上。我是 css 新手,我找不到方法。

我的代码是

<div class="sprite"></div>hi


.sprite {
width: 50px;
height: 72px;
background-image: url("http://s.cdpn.io/79/sprite-steps.png");

}

最佳答案

定义background positionone div 像这样

CSS

   .centerText{
float:left;
text-align:center;
}
.sprite {
width: 50px;
height: 72px;
background: url("http://s.cdpn.io/79/sprite-steps.png") 3px -6px;
}

HTML

<div class="centerText">
<div class="sprite"></div>hi
</div>

Demo

关于html - 如何居中 Sprite 图片和文字?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23486354/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com