.U_MD_UI_city_inputBox { display: inline-block; text-align: right; } /* input表单盒子的样式 */ .U_MD_UI_city_inpuBox_p { font-size: 12.5px; font-family: 微软雅黑; } /* input表单盒子下 p标签的样式 */ .U_MD_UI_city_inpuBox_p input { /* input表单盒子下 input标签的样式 */ width: 285px; height: 20px; color: #555555; text-indent: 5px; font-size: 12.5px; font-family: 微软雅黑; } .U_MD_UI_city_inpuBox_p input::-webkit-input-placeholder { /* input表单盒子下 input标签的placeholder颜色的样式 */ color: #b3b3b3; } .U_MD_UI_city_cityBox { /* 城市控件盒子的样式 */ width: 410px; box-sizing: border-box; padding: 17px 20px; border: 1px solid #dfdcdc; position: absolute; font-size: 12.5px !important; font-family: 微软雅黑 !important; background: #fff; z-index: 999; } .U_MD_UI_city_cityBox li { list-style: none; text-indent: 0px; padding: 0; } .U_MD_UI_city_menuBox, .U_MD_UI_city_Cont { /* 城市控件下 菜单盒子(ul) 与 内容盒子的样式(ul) */ border-bottom: 1px solid #c62f2f; height: 30px; padding: 0; margin: 0; } .U_MD_UI_city_menuBox li, .U_MD_UI_city_Cont li { /* 菜单盒子(ul) 与 内容盒子(ul) 下li的样式 */ position: relative; width: 25%; height: 100%; list-style: none; float: left; line-height: 30px; text-align: center; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding: 0 14px; box-sizing: border-box; cursor: pointer; } .U_MD_UI_city_menuChecked, .U_MD_UI_city_Cont_ochecked { /*选中菜单 与 内容时 的样式 */ background: #c62f2f; /* 红色背景 */ color: #fff; /* 白色字 */ } .U_MD_UI_city_menuoChecked { /* 添加绝对定位 注意:这里的样式名和上面的不一样 此样式是选中内容数据后 对应菜单变成的红色小圆点*/ position: relative; } .U_MD_UI_city_menuoChecked:before { /* 添加红色小圆点伪元素 */ content: ''; display: inline-block; width: 6px; height: 6px; border-radius: 100%; background: #c62f2f; vertical-align: 2px; position: absolute; left: -13px; top: 5px; } .U_MD_UI_city_Cont { /* 内容盒子样式(ul) */ border: none; margin-top: 15px; color: #626262; margin-right: 15px; } .U_MD_UI_city_Cont li { /* 内容盒子下li的鼠标指向时 从 pointer转为默认 */ cursor: inherit; } .U_MD_UI_city_Cont li > span { /* 内容盒子下li里span的样式 */ display: inline-block; width: 100%; cursor: pointer; } .U_MD_UI_city_Cont li > span:hover { /* 内容盒子下li的span的hover样式 */ background: #ffe8e8; /* 淡红色 */ } .U_MD_UI_city_Cont_ochecked:hover { /* 由于添加红色背景时的样式无hover 如若不加上这条 则hover为淡红色 因此使hover颜色 与 背景颜色相同*/ background: #c62f2f !important; } .U_MD_UI_city_hidden, #U_MD_UI_city_liTemplate { /* 模板 与 需要display为none时用到的 hidden样式 */ display: none; } .city_control { /* input标签的鼠标样式 */ cursor: pointer; }