/*
border-top-right-radius: 40px;
border-bottom-right-radius: 40px;
高度的一半就可以让右边变成一个半圆
*/
.right-show { width: 200px; height: 80px; border-top-right-radius: 40px; border-bottom-right-radius: 40px; background: pink; transition: all 0.6s; /* 过渡写到本身上 谁做过渡动画,写到谁身上*/ } .right-show:hover { width: 240px; } <div class="right-show"></div>