Question

有谁知道如何完全匹配谷歌地图mapTypeControl按钮样式（关于ui / css）？我找到了一个不错的tutorial，但按钮与默认的谷歌风格不匹配。有没有一种简单的方法可以准确地获取当前的谷歌地图按钮样式，或者我是否必须手动尝试匹配current样式（在每个新版本中可能会有所不同，这将是...你知道我的意思）。

Answer 1

快速浏览Chrome开发者控制台会显示以下内联样式（没有为任何按钮分配类或ID）。另请注意，此元素有一个空的no-styler浮动包装器，它还包含按钮菜单（terrain按钮）。

对于Map按钮：

direction: ltr; 
overflow: hidden; 
text-align: center; 
position: relative; 
color: rgb(0, 0, 0); 
font-family: Arial, sans-serif; 
-webkit-user-select: none; 
font-size: 13px; 
background-color: rgb(255, 255, 255); 
padding: 1px 6px; 
border: 1px solid rgb(113, 123, 135); 
-webkit-box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px; 
box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px; 
font-weight: bold; min-width: 29px; 
background-position: initial initial; 
background-repeat: initial initial;

对于Satellite按钮，唯一不同的样式是font-weight

模仿Google Maps mapTypeControl自定义控件

1 个答案: