我有以下 jsfiddle .
使用以下代码:
HTML:
<div class="animated-box">Animated box</div>
CSS:
.animated-box {
border:2px solid #bada55;
border-radius: 10px 0;
color: #bada55;
font-size: 20px;
font-weight:bold;
text-align:center;
padding:50px;
width:200px;
-webkit-animation:fontbulger 1s infinite;
-moz-animation: fontbulger 5s infinite;
-o-animation: fontbulger 1s infinite;
animation: fontbulger 1s infinite;
}
@-webkit-keyframes fontbulger {
0%, 100% {
font-size: 15px;
}
50% {
font-size: 20px;
}
}
@-moz-keyframes fontbulger {
0%, 100% {
font-size: 15px;
}
50% {
font-size: 20px;
}
}
@-o-keyframes fontbulger {
0%, 100% {
font-size: 15px;
}
50% {
font-size: 20px;
}
}
@keyframes fontbulger {
0%, 100% {
font-size: 15px;
}
50% {
font-size: 20px;
}
}
如何更改文本的大小,但不更改框的大小?
最佳答案
关于html - 框内的动画文本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27058115/