City.css 2.9 KB

123456789101112131415161718192021
  1. .U_MD_UI_city_inputBox { display: inline-block; text-align: right; }
  2. /* input表单盒子的样式 */
  3. .U_MD_UI_city_inpuBox_p { font-size: 12.5px; font-family: 微软雅黑; }
  4. /* input表单盒子下 p标签的样式 */
  5. .U_MD_UI_city_inpuBox_p input { /* input表单盒子下 input标签的样式 */ width: 285px; height: 20px; color: #555555; text-indent: 5px; font-size: 12.5px; font-family: 微软雅黑; }
  6. .U_MD_UI_city_inpuBox_p input::-webkit-input-placeholder { /* input表单盒子下 input标签的placeholder颜色的样式 */ color: #b3b3b3; }
  7. .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; }
  8. .U_MD_UI_city_cityBox li { list-style: none; text-indent: 0px; padding: 0; }
  9. .U_MD_UI_city_menuBox, .U_MD_UI_city_Cont { /* 城市控件下 菜单盒子(ul) 与 内容盒子的样式(ul) */ border-bottom: 1px solid #c62f2f; height: 30px; padding: 0; margin: 0; }
  10. .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; }
  11. .U_MD_UI_city_menuChecked, .U_MD_UI_city_Cont_ochecked { /*选中菜单 与 内容时 的样式 */ background: #c62f2f; /* 红色背景 */ color: #fff; /* 白色字 */ }
  12. .U_MD_UI_city_menuoChecked { /* 添加绝对定位 注意:这里的样式名和上面的不一样 此样式是选中内容数据后 对应菜单变成的红色小圆点*/ position: relative; }
  13. .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; }
  14. .U_MD_UI_city_Cont { /* 内容盒子样式(ul) */ border: none; margin-top: 15px; color: #626262; margin-right: 15px; }
  15. .U_MD_UI_city_Cont li { /* 内容盒子下li的鼠标指向时 从 pointer转为默认 */ cursor: inherit; }
  16. .U_MD_UI_city_Cont li > span { /* 内容盒子下li里span的样式 */ display: inline-block; width: 100%; cursor: pointer; }
  17. .U_MD_UI_city_Cont li > span:hover { /* 内容盒子下li的span的hover样式 */ background: #ffe8e8; /* 淡红色 */ }
  18. .U_MD_UI_city_Cont_ochecked:hover { /* 由于添加红色背景时的样式无hover 如若不加上这条 则hover为淡红色 因此使hover颜色 与 背景颜色相同*/ background: #c62f2f !important; }
  19. .U_MD_UI_city_hidden, #U_MD_UI_city_liTemplate { /* 模板 与 需要display为none时用到的 hidden样式 */ display: none; }
  20. .city_control { /* input标签的鼠标样式 */ cursor: pointer; }