1. /* 清除默认样式 */
    2. *{
    3.     margin: 0;
    4.     padding: 0;
    5. }
    6. /* 顶层topbar块容器 */
    7. .topbar{
    8.     min-width: 1190px;
    9.     height: 30px;
    10.     background-color: gray;
    11.     border-bottom: 1px solid #ddd;
    12. }
    13. /* 清除项目符号 */
    14. ul{
    15.     list-style: none;
    16. }
    17. /* 定宽 */
    18. .w{
    19.     width: 1190px;
    20.     margin: 0 auto: ;;
    21. }
    22. /* 内部的容器 */
    23. .topbar .inner{
    24.     height: 30px;
    25.     line-height: 30px;
    26. }
    27. /* 设置菜单*/
    28. .city{
    29.     float: left;
    30.     position: relative;
    31. }
    32. .city:hover .down{
    33.     display: block;
    34. }
    35. .city:hover .up{
    36.     background-color: greenyellow;
    37.     height: 29px;
    38.     padding-bottom: 2px;
    39.     background-color: white;
    40.     border: 1px rgb(204,204,204) solid;
    41.     border-bottom: none;
    42.     position: relative;
    43.     top: 30px;
    44. }
    45. .city:hover .up a{
    47. }
    48. .city .down{
    49.     width: 200px;
    50.     height: 300px;
    51.     background-color: yellow;
    52.     display: none;
    53.     position: absolute;
    54.     border: 1px solid #ddd;
    55.     box-shadow: 0 0 10px rgba(0,0,0,.5);
    56. }
    57. .shortcut{
    58.     float: right;
    59. }
    60. /* 设置菜单浮动 */
    61. .shortcut li{
    62.     float: left;
    63. }
    64. /* 设置链接文字的样式 */
    65. .top-bar a{
    66.     font: 12px/1.5 'microsoft Yahei','Heiti SC',sans-serif;
    67.     color: #999;
    68.     text-decoration: none;
    69. }
    70. /* 设置线条 */
    71. .line{
    72.     height: 10px;
    73.     width: 1px;
    74.     background-color: red;
    75.     float: left;
    76.     margin: 12px 10px 0px;
    77. }