最近在学CSS,看视频制作了一段有弹性的文字
上html
<body>
<div>
<span>这</span>
<span>是</span>
<span>一</span>
<span>段</span>
<span>有</span>
<span>弹</span>
<span>性</span>
<span>的</span>
<span>文</span>
<span>字</span>
</div>
</body>
上css :
div{
height: 100px;
margin-top: 100px;
text-align: center;
line-height: 100px;
}
div span{
color: red;
font-size: 34px;
transition:margin 5s ease-in-out;
}
div:hover span{
margin:0 30px;
}
效果网址:点击打开链接