API tools faq
paste
Guest User

CSS/HTML Problem

a guest
Mar 2nd, 2016
23
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 2.22 KB | None | 0 0
raw download clone embed print report
  1. CSS-Teil:
  2.  
  3. nav {
  4.                 position:relative;
  5.                 background:#48D1CC;
  6.             }
  7.            
  8.             nav ul {
  9.                 padding:0px;
  10.                 margin:0px;
  11.                 height:em;
  12.                 font-size:18pt;
  13.                 margin-left:35px;
  14.             }
  15.            
  16.             nav ul li {
  17.                 position: relative;
  18.                 list-style: none;
  19.                 display: inline;
  20.                 cursor:pointer;
  21.                 transition: all 500ms;
  22.                 padding-left: 6px;
  23.                 padding-right: 6px;
  24.                 padding-top: 3px;
  25.                 padding-bottom: 3px;
  26.             }
  27.            
  28.             nav ul li a:link {
  29.                 color: black;
  30.                 text-decoration: none;
  31.             }
  32.  
  33.             nav ul li a:visited {
  34.                 color: black;
  35.                 text-decoration: none;
  36.             }              
  37.  
  38.             nav ul li a:hover {
  39.                 color: black;
  40.                 text-decoration: none;
  41.             }
  42.  
  43.             nav ul li a:active {
  44.                 color: black;
  45.                 text-decoration: none;
  46.             }
  47.  
  48.             nav ul li:hover {
  49.                 background: lightblue;
  50.             }
  51.            
  52.             nav ul li ul {
  53.                 font-size: 14pt;
  54.                 position: absolute;
  55.                 top: auto;
  56.                 left: 0;
  57.                 height: 0px;
  58.                 opacity: 0;
  59.                 overflow: hidden;
  60.                 background:#48D1CC
  61.             }
  62.            
  63.             nav ul li:hover ul {
  64.                 height: auto;
  65.                 opacity: 1;
  66.                 overflow: visible;
  67.                 transition: all 500ms;
  68.             }
  69.  
  70.             nav ul li ul li {
  71.                 display: block;
  72.             }
  73.  
  74. HTML-Teil:
  75.  
  76. <!DOCTYPE html>
  77. <html lang="de">
  78.     <head>
  79.         <title>Test</title>
  80.         <meta charset="UTF-8">
  81.         <link rel="stylesheet" href="standard.css">
  82.         <link rel="stylesheet" href="menu.css">
  83.         <link rel="stylesheet" href="divstyles.css">
  84.         <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">
  85.     </head>
  86.     <body>
  87.         <div id="main">
  88.             <h1>Test Hauptüberschrift</h1>
  89.             <hr class="top">
  90.             <nav>
  91.                 <ul>
  92.                     <li><a href="index.html">Startseite</a></li>
  93.                     <li><a href=".html">Test</a></li>
  94.                     <li>
  95.                         <a href=".html">Test 2</a>
  96.                         <ul>
  97.                             <li><a href=".html">Untertest </a></li>
  98.                             <li><a href=".html">Untertest 2</a></li>
  99.                             <li><a href=".html">Untertest 3</a></li>
  100.                         </ul>
  101.                     </li>
  102.                     <li><a href=".html">Impressum</a></li>
  103.                 </ul>
  104.             </nav>
  105.             <hr class="standard">
  106.             <div id="text_1">
  107.                 <p>
  108.                     Dies ist der erste Text auf dieser Haupteite.<br>
  109.                     Dies ist nun die zweite Zeile auf dieser Hauptseite.
  110.                 </p>
  111.             </div>
  112.             <hr class="standard">
  113.         </div>
  114.     </body>
  115. </html>
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!