CSS3地圖熱點高亮是一個非常實用的效果，可以讓用戶在瀏覽網頁時更加方便地進行地圖導航。下面我們來看一下如何實現這個效果。

// HTML結構
<div class="map">
<img src="map.jpg">
<ul class="hotspots">
<li data-left="100" data-top="150">北京</li>
<li data-left="200" data-top="250">上海</li>
<li data-left="300" data-top="350">廣州</li>
</ul>
</div>
// CSS樣式
.map {
position: relative;
}
.hotspot {
position: absolute;
display: none;
}
.hotspot.active {
display: block;
}

首先，在HTML代碼中，我們需要使用一個div來包裝地圖圖片和熱點標記，并設置它的position屬性為relative。在熱點標記的ul列表中，每一個li都需要設置data-left和data-top屬性，用來表示它們在地圖上的位置。

然后，在CSS樣式中，我們為熱點標記添加一個樣式，并設置position屬性為absolute，這樣它們就可以根據父元素map的左上角位置進行定位。我們為所有熱點標記設置display:none屬性，將它們隱藏起來。

最后，我們為被選中的熱點標記添加一個active類名，將它的display屬性設置為block，這樣它就可以顯示出來。這個效果可以使用JavaScript來實現，具體方法就不在這里贅述了。