SHARE
TWEET

CSS - Menu Drop

marcosvinicius Oct 12th, 2017 53 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. body {
  2.     margin: 0;
  3.     padding: 0;
  4.     font-family: arial;
  5.     font-size: 12px;
  6. }
  7. .topo {
  8.     height: 30px;
  9.     background-color: #333;
  10. }
  11.  
  12. .topoint {
  13.     width: 100%;
  14.     max-width: 1040px;
  15.     height: 30px;
  16.     margin: auto;
  17. }
  18. .topoleft {
  19.     width: 50%;
  20.     height: 30px;
  21.     float: left;
  22. }
  23. .toporight {
  24.     width: 50%;
  25.     height: 28px;
  26.     float: right;
  27.     margin-top: 2px;
  28. }
  29. .topoleft ul {
  30.     margin: 0;
  31.     padding: 0;
  32.     list-style: none;
  33. }
  34. .topoleft li {
  35.     float: left;
  36.     height: 30px;
  37.     line-height: 30px;
  38.     margin-left: 8px;
  39.     margin-right: 8px;
  40. }
  41. .topoleft li a {
  42.     text-decoration: none;
  43.     color: #fff;
  44. }
  45. .topoleft li .ativo{
  46.     color: red;
  47. }
  48. .topobusca {
  49.     width: 110px;
  50.     height: 20px;
  51.     outline: 0;
  52. }
  53. .toporight a {
  54.     float: right;
  55. }
  56. .toporight input {
  57.     float: right;
  58. }
  59. .toporight img {
  60.     margin-right: 4px;
  61. }
  62. .topo2 {
  63.     height: 95px;
  64.     color: 000;
  65. }
  66. .topo2int {
  67.     width: 100%;
  68.     max-width: 1040px;
  69.     height: 95px;
  70.     margin: auto;
  71. }
  72. .logo {
  73.     width: 230px;
  74.     height: 90px;
  75.     float: left;
  76.     margin-top: 5px;
  77. }
  78. .topo2 .banner {
  79.     width: 650px;
  80.     height: 80px;
  81.     float: right;
  82.     margin-top: 7px;
  83.     background-color: red;
  84. }
  85. .menu {
  86.     height: 40px;
  87.     background-color: red;
  88. }
  89. .menuint {
  90.     width: 100%;
  91.     max-width: 1040px;
  92.     height: 40px;
  93.     margin: auto;
  94. }
  95. .menu ul {
  96.     margin: 0;
  97.     padding: 0;
  98.     list-style: none;
  99. }
  100. .menu li {
  101.     float: left;
  102.     height: 40px;
  103.     line-height: 40px;
  104.     padding-left: 8px;
  105.     padding-right: 8px;
  106. }
  107. .menu li:hover .submenu {
  108.     display: block;
  109. }
  110. .menu a{
  111.     color: #FFF;
  112.     text-decoration: none;
  113. }
  114. .submenu {
  115.     width: 150px;
  116.     height: 150px;
  117.     background-color: red;
  118.     position: absolute;
  119.     display: none;
  120. }
  121. .submenuitem {
  122.     height: 30px;
  123.     line-height: 30px;
  124.     width: 140px;
  125.     padding-left: 10px;
  126. }
  127. .submenuitem:hover {
  128.     background-color: #FF5555;
  129. }
  130. .submenusub {
  131.     width: 100px;
  132.     height: 100px;
  133.     background-color: blue;
  134.     position: relative;
  135.     float: right;
  136.     display: none;
  137.    
  138. }
  139. .menu li:hover .submenu .submenusub {
  140.     display: block;
  141. }
RAW Paste Data
Top