---
# System prepended metadata

title: CSS / 擬態選擇器1. - hover，當滑鼠滑過時
tags: [CSS-擬態選擇器]

---

# CSS / 擬態選擇器1. - hover，當滑鼠滑過時


### :hover，範例應用:

- HTML:

```
    <div class="container">
        <a class="btn" href="#">點擊</a>
    </div>
```

### 針對 .btn class 按鈕去增加 :hover

- CSS:

```
.btn {
    display: block;
    padding-left: 50px;
}

// 擬態選擇器:hover
.btn:hover {
    color: green;
    font-size: 40px;
}
```

本來的樣子：

![](https://i.imgur.com/IbIHm5I.png)

滑鼠經過的樣子: 

- 我撰寫了文字：綠色、文字放大到 40px

![](https://i.imgur.com/mpha17r.png)

###### tags: `CSS-擬態選擇器`








###### tags: `CSS-擬態選擇器`