Autor | Zpráva | ||
---|---|---|---|
Klasik Profil * |
#1 · Zasláno: 9. 9. 2009, 14:53:33
Ahoj, mám kody na css + html.. Všechno je ok, ale když ukážete na menu, které se vyroluje tak vyrolovaná políčka se schovají pod spojdí layout
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>laylout pomocí pozicování v CSS</title> <meta http-equiv="Content-Type" content="text/html; charset=windows-1250"> <link rel="stylesheet" type="text/css" href="cssstyle.css" media="screen" title="style (screen)" /> <body> <div class="obal"> <div class="head"> Hlavička , obrazek, a ostatní kraviny </div><!--konec hlavičky --> <div class="head1"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="application/xhtml+xml; charset=utf-8" /> <meta http-equiv="content-language" content="cs" /> <meta http-equiv="imagetoolbar" content="no" /> <meta name="description" content="Vodorovné vysouvací menu." /> <meta name="keywords" content="Vysouvací menu, hover menu" /> <meta name="author" content="Jiří Černý (tvorbawebu@email.cz)" /> <meta name="robots" content="all,follow" /> <link rel="stylesheet" type="text/css" href="menu/hover_menu/style.css" media="screen" /> </head> <body> <div id="vodorovne-menu"> <ul> <li><a href="#">Hlavní strana</a></li> <li><a href="#">Reference</a> <ul> <li><a href="#">Loga</a></li> <li><a href="#">3D</a></li> <li><a href="#">Webdesign</a></li> </ul> </li> <li><a href="#">Blog</a> <ul> <li><a href="#">PHP</a></li> <li><a href="#">CSS</a></li> <li><a href="#">C++</a></li> </ul> </li> <li><a href="#">Kontakt</a></li> </ul> </div> </body> </html> </div><!--konec hlavičky --> <div class="pravy"> Pravý sloupes a další texty, ikonky, reklama... </div><!--konec pravého sloupce --> <div class="obsah"> Hlavní odsah stránky a další texty </div><!--konec hlavního obsahu --> </div><!--konec obal --> </body> </html> *{margin: 0;padding: 0;} body { behavior: url("csshover3.htc"); font-size:90%;} /* menu */ #vodorovne-menu {width: 100%;margin: 10px;} #vodorovne-menu li {float:left;list-style-type:none;} #vodorovne-menu li a {display:block; height:24px;width: 110px;line-height:24px; text-align:center; text-decoration:none;color:#000;} #vodorovne-menu li a:hover { background: #0E3D6F; color:#fff;} #vodorovne-menu li ul {display:none;} #vodorovne-menu li:hover ul { display:block; position:absolute; border: solid #F0F0F0; border-width:0 1px 1px 1px;} #vodorovne-menu li:hover ul li { display:block; float:none; height:24px; width: 110px; border-top: 1px solid #F0F0F0;} #vodorovne-menu li:hover ul li a {background:#fff;} #vodorovne-menu li:hover ul li a:hover {background: #0E3D6F;color:#fff;} #vertikalni-menu{clear:both;width: 100%;margin: 25px;} #vertikalni-menu li {list-style-type:none;position:relative;width: 110px;} #vertikalni-menu li a {display:block; height:24px;width: 104px;line-height:24px;text-decoration:none; color:#000;padding: 0 3px;} #vertikalni-menu li a:hover { background: #0E3D6F; color:#fff;} #vertikalni-menu li ul{position:absolute;top:0;left:100px;visibility:hidden;} #vertikalni-menu li:hover ul{visibility:visible;display:block;position:absolute;border: solid #F0F0F0; border-width:0 1px 1px 1px;} #vertikalni-menu li:hover ul li { display:block;position:relative; float:none; height:24px; width: 110px; border-top: 1px solid #F0F0F0;} #vertikalni-menu li:hover ul li a {background:#fff;} #vertikalni-menu li:hover ul li a:hover {background: #0E3D6F;color:#fff;} |
||
SwimX Profil |
#2 · Zasláno: 9. 9. 2009, 15:04:51 · Upravil/a: SwimX
Klasik:
1) vkládej kódy do 2) <div class="head1"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="application/xhtml+xml; charset=utf-8" /> <meta http-equiv="content-language" content="cs" /> <meta http-equiv="imagetoolbar" content="no" /> <meta name="description" content="Vodorovné vysouvací menu." /> <meta name="keywords" content="Vysouvací menu, hover menu" /> <meta name="author" content="Jiří Černý (tvorbawebu@email.cz)" /> <meta name="robots" content="all,follow" /> <link rel="stylesheet" type="text/css" href="menu/hover_menu/style.css" media="screen" /> </head> <body> to asi nebude zrovna to pravé ořechové, že? Sice to neřeší tvůj problém, ale takle to rozhodně správně není. Zkus kouknout na Menu v CSS Knihovně |
||
Časová prodleva: 15 let
|
0