首页 > 网站建设 >

网站建设公司怎么用代码创建翻转按钮

发布时间:2019-10-09 作者:网站建设

  网站建设公司浅谈怎么用代码创建翻转按钮,翻转按钮是一种用来制作网站导航菜单的素材。当用户把鼠标停放在翻转按钮上时,按钮会呈现一个翻转的动作,同时变换成另一种样式;当用户把鼠标从翻转按钮上移开时,按钮又会恢复到原来的样式。
  CSS中的transition属性用于设置CSS在一定的时间区间内平滑过渡的属性值,这种效果可以在鼠标单击、获得焦点、被点击或元素有任何改变时触发,并圆滑地以动画效果改变CSS的属性值。它的语法如下所示:
  可以看到,transition是一个简写的属性,它可以用来设置4个过渡的属性,这4个属性的描述分别如下。
(1)transition-property:规定设置过渡效果的CSS属性的名称。
(2)transition-duration:规定设置过渡效果需要的时间,单位可以是秒(s)或者毫秒(ms)。
(3)transition-timing-function:规定速度效果的速度曲线。
(4)transition-delay:定义过渡效果何时开始。
例如下面的代码:
  在这段代码中,页面只有一个超链接标签,我们通过CSS将其设置成一个可以翻转的按钮。CSS中只有两个选择器,在a选择器中,首先设置a元素的上下内边距为5个像素,左右内边距为20个像素,取消超链接默认的下划线设置,定义超链接的字体和大小,文本颜色设置为白色,然后为其设置一个背景色。深圳网站建设公司本文关于“网站建设公司怎么用代码创建翻转按钮”的知识就介绍分享到这里,谢谢关注,博纳网络编辑整理。
文章标题:网站建设公司怎么用代码创建翻转按钮
本文地址:https://www.198bona.com/news/4200.html
如果您觉得案例还不错请帮忙分享:

网站建设

网络推广

解决方案

域名主机

建站行业资讯