マウスを乗せたときの対象の挙動を指定する #hover

f:id:hrt0kmt:20140714131618p:plain

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="utf-8">
    <style>
        .a {
            width: 50px;
            height: 50px;
            padding: 10px;
            margin: 30px;
            background-color:#ff0000;
            border-top:solid 10px #0000ff;
            border-radius:10px;
        }
        .a:hover {
            width: 100px;
            height: 100px;
        }
    </style>
</head>
<body>
    <div class="a">foo</div>
</body>
</html>

hoverは、マウスが対象の上に乗った(hover: ホバー)際の挙動を指定できます。

f:id:hrt0kmt:20140714132042p:plain