CSS3 單項(xiàng)屬性過渡
提問人:劉團(tuán)圓發(fā)布時(shí)間:2020-11-19
先完成一個(gè)簡單的單項(xiàng)屬性過渡的實(shí)例。
【例題】創(chuàng)建單項(xiàng)屬性過渡
按照過渡原理,在頁面中先建立一個(gè)div,然后為它添加transition屬性,緊接著在transition屬性的值里寫入想要改變的屬性和改變時(shí)間,代碼如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
div{
width: 200px;
height: 200px;
transition:width 2s;
}
div:hover{
width: 500px;
}
.d1{
background: pink;
}
.d2{
background: lightblue;
}
.d3{
background: lightgreen;
}
</style>
</head>
<body>
<div></div>
<div></div>
<div></div>
</body>
</html>
繼續(xù)查找其他問題的答案?
相關(guān)視頻回答
點(diǎn)擊加載更多評論>>