实现井字格,两个div怎样同步效果,求指导
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
.one{
width: 300px;
height: 300px;
position: absolute;
top: 100px;
left: 100px;
border-left:solid 1px red;
border-right:solid 1px red;
transform: scale(1,1);
}
.two{
width: 350px;
height: 250px;
position: absolute;
top: 120px;
left:80px;
border-top :solid 1px red;
border-bottom:solid 1px red;
transform: scale(1,1);
}
.one:hover,.two:hover{
transform: scale(0,0);transition:all 0.4s ease-in 0s;transform-origin: center center;
}
</style>
</head>
<body>
<div class="one"></div>
<div class="two"></div>
</body>
</html>