扬州旅游地图手绘
.mapcontainer {
position: relative;
width: 100%;
maxwidth: 600px;
margin: 20px auto;
}
.map {
width: 100%;
height: auto;
maxwidth: 600px;
}
.marker {
position: absolute;
backgroundcolor: FF5733;
color: fff;
borderradius: 50%;
padding: 5px 10px;
fontsize: 16px;
cursor: pointer;
transition: 0.3s easeinout;
transform: translate(50%, 50%);
}
.marker:hover {
transform: scale(1.1) translate(50%, 50%);
}
扬州旅游地图标记
A
B
C
上面的地图标记了三个地点:
- 地点 A: 瘦西湖
- 地点 B: 个园
- 地点 C: 大明寺