css宽度自动变化的动画

CSS宽度自动变化的动画是网页设计中常用的一种效果，通过设置CSS样式，达到宽度自动变化的效果，为网页增添美观的效果。

<div id="Box">
  <p>这是一段文字</p>
</div>

上述代码中的Box代表一个div容器，而p标签则是在容器中添加的一段文字，div的初始宽度为100px，高度为50px，背景颜色为灰色。在CSS样式中，使用了transition属性来设置宽度变化动画时间，即当hover触发时，宽度从100px过渡到200px，以此来实现宽度自动变化的动画效果。

可以根据实际需求设置不同的宽度和动画时间，达到更美观的效果。