如何在旋转的圆圈背面居中放置文本？
How do I center text inside the back of a circle that swivels around?
我遇到了一个问题，我试图将文本居中放置在一个正在旋转的圆圈的背面。我尝试使用 polygon() 但我无法将多边形塑造成我想要的形状。我的目标是旋转圆圈并看到中间的文本，并允许我更改文本而不必每次都更改代码。
.flip-box {
background-color: transparent;
width: 200px;
height: 200px;
text-align: center;
perspective: 1000px;
}
.flip-box-inner {
position: relative;
width: 200px;
height: 200px;
text-align: center;
transition: transform 0.8s;
transform-style: preserve-3d;
}
.flip-box:hover .flip-box-inner {
transform: rotateY(180deg);
}
.flip-box-front,
.flip-box-back {
position: absolute;
width: 200px;
height: 200px;
text-align: center;
border-radius: 50%;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.flip-box-front {
background-color: #ffffff;
color: black;
}
.flip-box-back {
background-color: #C8102E;
color: white;
font-size: 14px;
text-align: center;
vertical-align: middle;
transform: rotateY(180deg);
}
<a href="https://google.com">
<div class="flip-box" style="height:200px; width:200px;">
<div class="flip-box-inner">
<div class="flip-box-front">
<a href="https://google.com"><img src="/media/EiffelTower" alt="Paris" style="width:200px;height:200px"></a>
</div>
<div class="flip-box-back">
<p>The Eiffel Tower is a wrought-iron lattice tower on the Champ de Mars in Paris, France. It is named after the engineer Gustave Eiffel, whose company designed and built the tower. </p>
</div>
</div>
</div>
</a>
只需在 .flip-box-back
中添加居中属性
您可以使用 flexbox、grid 或 absolute method
FLEXBOX
.flip-box-back {
display: flex;
align-items: center;
justify-content: center;
}
网格
.flip-box-back {
display: grid;
place-items: center;
}
绝对
.flip-box-back {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
为此不要忘记给父元素position: relative。
我在你的代码中使用了 grid method。
.flip-box {
background-color: transparent;
width: 200px;
height: 200px;
text-align: center;
perspective: 1000px;
}
.flip-box-inner {
position: relative;
width: 200px;
height: 200px;
text-align: center;
transition: transform 0.8s;
transform-style: preserve-3d;
}
.flip-box:hover .flip-box-inner {
transform: rotateY(180deg);
}
.flip-box-front,
.flip-box-back {
position: absolute;
width: 200px;
height: 200px;
text-align: center;
border-radius: 50%;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.flip-box-front {
background-color: #ffffff;
color: black;
}
.flip-box-back {
background-color: #C8102E;
color: white;
font-size: 14px;
text-align: center;
vertical-align: middle;
transform: rotateY(180deg);
/* Centering text using GRID */
display: grid;
place-items: center;
}
<a href="https://google.com">
<div class="flip-box" style="height:200px; width:200px;">
<div class="flip-box-inner">
<div class="flip-box-front">
<a href="https://google.com"><img src="data:image/jpeg;base64,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" alt="Paris" style="width:200px;height:200px"></a>
</div>
<div class="flip-box-back">
<p>The Eiffel Tower is a wrought-iron lattice tower on the Champ de Mars in Paris, France. It is named after the engineer Gustave Eiffel, whose company designed and built the tower. </p>
</div>
</div>
</div>
</a>
我遇到了一个问题，我试图将文本居中放置在一个正在旋转的圆圈的背面。我尝试使用 polygon() 但我无法将多边形塑造成我想要的形状。我的目标是旋转圆圈并看到中间的文本，并允许我更改文本而不必每次都更改代码。
.flip-box {
background-color: transparent;
width: 200px;
height: 200px;
text-align: center;
perspective: 1000px;
}
.flip-box-inner {
position: relative;
width: 200px;
height: 200px;
text-align: center;
transition: transform 0.8s;
transform-style: preserve-3d;
}
.flip-box:hover .flip-box-inner {
transform: rotateY(180deg);
}
.flip-box-front,
.flip-box-back {
position: absolute;
width: 200px;
height: 200px;
text-align: center;
border-radius: 50%;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.flip-box-front {
background-color: #ffffff;
color: black;
}
.flip-box-back {
background-color: #C8102E;
color: white;
font-size: 14px;
text-align: center;
vertical-align: middle;
transform: rotateY(180deg);
}
<a href="https://google.com">
<div class="flip-box" style="height:200px; width:200px;">
<div class="flip-box-inner">
<div class="flip-box-front">
<a href="https://google.com"><img src="/media/EiffelTower" alt="Paris" style="width:200px;height:200px"></a>
</div>
<div class="flip-box-back">
<p>The Eiffel Tower is a wrought-iron lattice tower on the Champ de Mars in Paris, France. It is named after the engineer Gustave Eiffel, whose company designed and built the tower. </p>
</div>
</div>
</div>
</a>
只需在 .flip-box-back
您可以使用 flexbox、grid 或 absolute method
FLEXBOX
.flip-box-back {
display: flex;
align-items: center;
justify-content: center;
}
网格
.flip-box-back {
display: grid;
place-items: center;
}
绝对
.flip-box-back {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
为此不要忘记给父元素position: relative。
我在你的代码中使用了 grid method。
.flip-box {
background-color: transparent;
width: 200px;
height: 200px;
text-align: center;
perspective: 1000px;
}
.flip-box-inner {
position: relative;
width: 200px;
height: 200px;
text-align: center;
transition: transform 0.8s;
transform-style: preserve-3d;
}
.flip-box:hover .flip-box-inner {
transform: rotateY(180deg);
}
.flip-box-front,
.flip-box-back {
position: absolute;
width: 200px;
height: 200px;
text-align: center;
border-radius: 50%;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.flip-box-front {
background-color: #ffffff;
color: black;
}
.flip-box-back {
background-color: #C8102E;
color: white;
font-size: 14px;
text-align: center;
vertical-align: middle;
transform: rotateY(180deg);
/* Centering text using GRID */
display: grid;
place-items: center;
}
<a href="https://google.com">
<div class="flip-box" style="height:200px; width:200px;">
<div class="flip-box-inner">
<div class="flip-box-front">
<a href="https://google.com"><img src="data:image/jpeg;base64,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" alt="Paris" style="width:200px;height:200px"></a>
</div>
<div class="flip-box-back">
<p>The Eiffel Tower is a wrought-iron lattice tower on the Champ de Mars in Paris, France. It is named after the engineer Gustave Eiffel, whose company designed and built the tower. </p>
</div>
</div>
</div>
</a>