CSS 可以用于控制網頁中的元素樣式,也可以增加交互性,比如當用戶點擊一個圖片時,實現跳轉的效果。
<style> /*定義圖片的樣式*/ .image{ width:200px; height:200px; background-image: url('圖片地址'); background-size: cover; cursor:pointer; } </style>
其中,cursor屬性可以定義鼠標在元素上的樣式,設為pointer時可讓鼠標形成一個手型,表明該元素可被點擊。
<div class="image" onclick="location.href='跳轉地址'"></div>
將圖片的class設置為.image,然后添加onclick屬性,設定跳轉的地址即可。
<a href="跳轉地址"> <div class="image"></div> </a>
如果你希望點擊圖片以外的區域也能跳轉,可以將a標簽嵌套到圖片div中。
CSS 的交互能力非常強大,通過設置鼠標樣式、動畫效果、點擊事件等等,可以為頁面增添豐富的互動體驗。