<!DOCTYPE html>
<html>
<head>
<style>
div {
width: 300px;
height: 100px;
background-color: yellow;
border: 1px solid black;
transform: translate(50px,100px);
}
</style>
</head>
<body>
<h1>translate()メソッド</h1>
<p>translation()メソッドは要素を現在の位置から移動します。</p>
<div>
このdiv要素は、現在の位置から右に50px、下に 100px移動されます。
</div>
</body>
</html>