在一个id为bt1的按钮上设置样式，如下：
#bt1{
font-family:微软雅黑 <!-- 字体 --> width: 60px <!-- 宽度 -->height:30px <!-- 高度 -->
font-size:14px <!-- 字体大小-->
color:gray <!--字体颜色 -->
border: 1px solid red； <!-- 边框；边框宽度、单线、边框颜色 -->
margin-left: 10px <!-- 左边距，相应的还有右边距margin-right, 上margin-top,下 margin-buttom -->
background-color:#F1F1F1 <!--背景色；十六位颜色表示时前加#符号
transparent是透明-->
box-shadow:10px 10px 10px gray <!-- 阴影；x轴偏移（右偏为正），y轴偏移（向下 为正），模糊度，模糊颜色 -->
border-radius:10px 10px 10px 10px<!-- 圆角；左上，右上，右下，左下-->
cursor:pointer <!-- 鼠标经过时鼠标变成小手 -->
}
像这种需求你可以用js或者jQuery编写。
如果不想使用js或者jquery，那么用css的过渡属性代码如下：
鼠标滑入，出现效果
transition: right .7s ease
right为过渡的属性，可以是宽高，top/lelft/right/bottom/opacity等等。只要记住transition不能过渡display就行。
.7s 为过渡所需要的时间，ease为过渡的样式，是匀速过渡还是先快后慢等等。
如果没有鼠标事件，那么就需要用到css3的动画，animation。css3的动画详情卡查看https://mengkedu.com/
