Css анимация с использованием псевдоклассов
Скажите пожалуйста как написать такую вот анимацию с использованием псевдоклассов.
При наведении на блок мыши появляется полоса вверху данного блока, то есть увеличивается от 0 до 10 px |
imedia,
<!DOCTYPE html >
<html>
<head>
<title></title>
<style type="text/css">
.target {
position: absolute;
top: 50px;
left: 100px;
width: 200px;
border-top: 0px solid red;
background-color: Lime;
-webkit-transition:border-top 0.5s ease;
-moz-transition:border-top 0.5s linear;
-o-transition:border-top 0.5s linear;
transition:border-top 0.5s linear;
}
.target:hover
{ border-top: 10px solid red;
}
</style>
</head>
<body>
<div class="target">Наведи сюда мьшь</div>
</body>
</html>
|
| Часовой пояс GMT +3, время: 22:55. |