百度地图infoWindow圆角处理

来源:互联网 发布:阿里云centos命令 编辑:程序博客网 时间:2024/04/30 16:12

最近的一个项目用到了百度地图API里边的infoWindow弹框,但是百度自带的infoWindow弹框是个直角的矩形框,显示过于难看,于是有了将该框改为圆角的想法,但是API本身不支持样式的设置,所以我最终选择在弄清页面生成的弹框html元素后,自己来给他们定义css,以达到圆角效果,如下是我的css样式

/*地图标题*/    .anchorBL{        display:none;    }    .BMap_bubble_title{        color:black;        font-size:13px;        font-weight: bold;        text-align:left;    }    .BMap_pop div:nth-child(1){        border-radius:7px 0 0 0;    }    .BMap_pop div:nth-child(3){        border-radius:0 7px 0 0;background:#ABABAB;;        /*background: #ABABAB;*/        width:23px;        width:0px;height;0px;    }    .BMap_pop div:nth-child(3) div{        border-radius:7px;    }    .BMap_pop div:nth-child(5){        border-radius:0 0 0 7px;    }    .BMap_pop div:nth-child(5) div{        border-radius:7px;    }    .BMap_pop div:nth-child(7){        border-radius:0 0 7px 0 ;    }    .BMap_pop div:nth-child div(7){        border-radius:7px ;    }


2 0
原创粉丝点击