css响应式字大小怎样变 |css好看字体动画

/* CSS代码 */
@media screen and (max-width: 480px){
p {
font-size: 14px;
}
}
@media screen and (min-width: 481px) and (max-width: 768px){
p {
font-size: 16px;
}
}
@media screen and (min-width: 769px) and (max-width: 1024px){
p {
font-size: 18px;
}
}
@media screen and (min-width: 1025px) {
p {
font-size: 20px;
}
}

在上述代码中，使用了@media查询来针对不同的屏幕尺寸设置不同的字体大小。在屏幕尺寸小于等于480px时，字体大小为14px；在屏幕尺寸在481px到768px之间时，字体大小为16px；在屏幕尺寸在769px到1024px之间时，字体大小为18px；在屏幕尺寸大于1025px时，字体大小为20px。

通过这些设置，文字的大小可以根据不同的屏幕尺寸动态地改变，从而使文字在不同的屏幕尺寸下都能够保持合适的大小。