<style>
.city {
display: inline-block;
margin: 20px 0 0 20px;
padding: 5px 20px;
border: 1px solid #44a5fc;
color: #333;
transform: skew(-45deg);
}
.city div {
transform: skew(45deg);
}
.city:hover{ background:red;}
</style>
<html>
<body>
<div class="city"><div>上海</div></div>
<div class="city"><div>澳门</div></div>
</body>
</html>