CSS3实现图片上浮动画_html/css
来源:动视网
责编:小采
时间:2020-11-27 16:04:38
CSS3实现图片上浮动画_html/css
CSS3实现图片上浮动画_html/css_WEB-ITnose:.gist { width:220px; height:130px; background-image: url(2.jpg); background-repeat:no-repeat; border:5px solid green; background-position:50% 50%; transition:background-position 2s; -moz-transition:background-position 2s; /* Firefox 4 */ -w
导读CSS3实现图片上浮动画_html/css_WEB-ITnose:.gist { width:220px; height:130px; background-image: url(2.jpg); background-repeat:no-repeat; border:5px solid green; background-position:50% 50%; transition:background-position 2s; -moz-transition:background-position 2s; /* Firefox 4 */ -w

.gist { width:220px; height:130px; background-image: url(2.jpg); background-repeat:no-repeat; border:5px solid green; background-position:50% 50%; transition:background-position 2s; -moz-transition:background-position 2s; /* Firefox 4 */ -webkit-transition:background-position 2s; /* Safari and Chrome */ -o-transition:background-position 2s; /* Opera */}.gist:hover { background-position: 50% -100px;}图片水平垂直居中:background-position:50% 50%;
CSS3实现图片上浮动画_html/css
CSS3实现图片上浮动画_html/css_WEB-ITnose:.gist { width:220px; height:130px; background-image: url(2.jpg); background-repeat:no-repeat; border:5px solid green; background-position:50% 50%; transition:background-position 2s; -moz-transition:background-position 2s; /* Firefox 4 */ -w