<分区>
<分区>
我试图将我制作的覆盖文本的圆圈的文本居中，代码如下:
.sticker {
position: absolute;
z-index: 5;
width: 5em;
height: 5em;
background-color: yellow;
border-radius: 100%;
background-image: linear-gradient(135deg, #ffff00, #ffff00 15%, cyan);-image: linear-gradient(-45deg, #08f, #0f8);
top: -13px;
}
.block__container {
position: relative;
}<span class='flash font--heading' ><br><b class = "sticker">+FREE shipping!</span></b><br>最佳答案
使用 Flexbox，所以将 sticker css 更改为:-
.sticker {
display:flex;
justify-content:center;
width: 5em;
align-items:center;
text-align:center;
height: 5em;
background-color: yellow;
border-radius: 100%;
background-image: linear-gradient(135deg, #ffff00, #ffff00 15%, cyan);-image: linear-gradient(-45deg, #08f, #0f8);
}
并将 HTML 更新为:-
<span class='flash font--heading' ><br><b class = "sticker">+FREE shipping!</span></b><br>
关于html - 如何使边框半径框中的文本居中，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/57559693/