CSS过渡-Transitions文字逐渐变大的效果图：
小伙伴们我没有截取动图的软件，不能给你们看文字逐渐放大的动图啦
鼠标点击前：
鼠标点击后：
有两种代码，两种变大方式：
第一种：
动态效果展示：
第二种：
动态效果展示：
第一种代码实现：
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title></head><body><div><span>盐</span><span>城</span><span>师</span><span>范</span><span>学</span><span>院</span></div></body></html><style>div{height: 200px;background-color: red;margin-top: 100px;text-align: center;}div span{/* 垂直居中：行内元素行高=外层元素height */line-height: 200px;font-size: 24px;/* 字体变化 2s内变化 匀速变化 */transition: font-size 2s linear;}div span:hover{font-size: 150px;}</style>第二种代码实现：
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title></head><body><div><span>盐</span><span>城</span><span>师</span><span>范</span><span>学</span><span>院</span></div></body></html><style>div{height: 200px;background-color: red;margin-top: 100px;text-align: center;}div span{/* 垂直居中：行内元素行高=外层元素height */line-height: 200px;font-size: 24px;/* 字体变化 2s内变化 匀速变化 */transition: font-size 2s linear;}div:hover span{font-size: 150px;}</style>
