loading
Please wait while loading...
返回 使用 CSS3 制作簡單的變換特效

CSS3 提供一個簡單的語法用以制作動態變換效果而不需要使用到 Flash 或 javascript, 它的使用方法非常簡單, 只需在你想要制作特效的原樣式中加入 transition 屬性即可, 以下是一個簡單的例子, 對應的效果可參考頂部的菜單列:

#top_menu li a {
	color: #FFF;
	padding: 5px 10px;
	border-radius: 10px;
	text-decoration: none;

	-webkit-transition: all 300ms linear;
	-moz-transition: all 300ms linear;
	-o-transition: all 300ms linear;
}
#top_menu li a:hover {
	background-color: #F9C;
	color: #09F;
}

The result you can refer to the top menu on this page by using firefox or chrome.

Comments
comments powered by Disqus