做一个从中心向两边水平扩展的动画效果

2024-04-27 15:09:25

字体：大中小

来源：转载

供稿：网友

用到了CSS3的transition属性，其实是从左往右扩展的。因为设置了块居中，产生从中心向左右扩展的感觉

<!doctype html><html><head><style>	#box{		background-color:gray;		height:20px;		overflow:hidden;	}	.a{		background-color:red;		width:0;		height:20px;		margin: 0 auto;		transition:width .8s;		-webkit-transition:width .8s;	}	#box:hover .a{		width:100%;		transition:width .8s;		-webkit-transition:width .8s;	}</style></head><body><div id="box"><div class="a"></div></div></body></html>

上一篇：实验吧 Zcrypt（ASIS CTF 2015） BY Assassin

下一篇：wex5中使用password控件,密码可以隐藏,判断输入框是否为空时,无法通过password的.val()方法获取数据