CSS3的鼠標(biāo)經(jīng)過(guò)效果非常豐富，其中之一是通過(guò)放大來(lái)吸引用戶的注意力。下面我們來(lái)看一下如何實(shí)現(xiàn)一個(gè)簡(jiǎn)單的鼠標(biāo)經(jīng)過(guò)放大的按鈕效果。

/*CSS代碼*/
.btn{
width: 100px;
height: 50px;
background-color: #007bff;
color: #fff;
font-size: 16px;
text-align: center;
line-height: 50px;
transition: all .3s ease;
}
.btn:hover{
transform: scale(1.2);
}

首先，我們定義一個(gè)按鈕的樣式，包括背景顏色、字體顏色、字體大小、文本居中等等。我們給按鈕添加了一個(gè)過(guò)渡效果，使得在鼠標(biāo)離開時(shí)緩慢回到原始大小。

接下來(lái)，在:hover偽類下，我們定義按鈕的縮放效果，使用transform:scale(1.2)進(jìn)行放大。這表示按鈕的大小會(huì)在原來(lái)的基礎(chǔ)上增加20%。

這個(gè)簡(jiǎn)單的CSS代碼就能讓您的按鈕在鼠標(biāo)經(jīng)過(guò)時(shí)有一個(gè)吸引眼球的效果，絕對(duì)能讓您的網(wǎng)站更加具有吸引力。