Autor | Zpráva | ||
---|---|---|---|
uzivatel1111 Profil * |
#1 · Zasláno: 21. 7. 2014, 22:48:28
zdravím, mám v plánu udělat kolem položek v menu takové jednduché ohraničení:
http://imgup.cz/image/GQg ale nějak mi to nejde: http://imgup.cz/image/GQh myslel jsem si. že stačí dát k nav ul atribut border a ohraničí se vše , co v nav ul je. Ale tak to asi nejde přidávám kód HTML <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <meta name="generator" content="PSPad editor, www.pspad.com"> <title>nadpis</title> <link rel="stylesheet" href="styl.css" type="text/css"> </head> <body> <header> <div id="logo""><h1>Header</h1></div> <br /> <nav> <ul> <li><a href="#">ODKAZ</a></li> <li><a href="#">ODKAZ</a></li> <li><a href="#">ODKAZ</a></li> <li><a href="#">ODKAZ</a></li> <li><a href="#">ODKAZ</a></li> <li><a href="#">ODKAZ</a></li> </ul> </nav> <div class="cleaner"></div> </header> </body> </html> a CSS nav ul { background: green; margin: 0px 0px 0px 10px; list-style-type: none; border: 2px solid black; } nav ul li { float: left; padding: 10px 25px; margin-right: 20px; } nav ul li a { text-decoration: none; color: green; } |
||
martinK Profil |
#2 · Zasláno: 21. 7. 2014, 23:02:06
uzivatel1111:
Stačí přidat rozměry width a height do nav ul a odstranit zelenou barvu pozadí, ideálně pozadí nedefinovat ;) |
||
Marschmallow Profil |
uzivatel1111:
Třeba takhle? HTML: <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <meta name="generator" content="PSPad editor, www.pspad.com"> <title>nadpis</title> <link rel="stylesheet" href="styl.css" type="text/css"> </head> <body> <header> <div id="logo""><h1>Header</h1></div> <br /> <nav> <ul> <li><a href="#">ODKAZ</a></li> <li><a href="#">ODKAZ</a></li> <li><a href="#">ODKAZ</a></li> <li><a href="#">ODKAZ</a></li> <li><a href="#">ODKAZ</a></li> <li><a href="#">ODKAZ</a></li> </ul> </nav> <div class="cleaner"></div> </header> </body> </html> CSS: nav { border: 5px solid navy; border-color: green; } nav ul li { display: inline; list-style-type: none; padding: 10px 25px; margin-right: 20px; } Jestli chceš více informací, na JPW máš článek o border-color. |
||
Bubák Profil |
#4 · Zasláno: 21. 7. 2014, 23:28:06
Nemáš ukončené obtékání položek, obtékaní ukončuješ až za
<nav> a proto se orámování <ul> neprojeví.
Doporučuji http://jecas.cz/float#overflow Deklarovat stejnou barvu pro pozadí a pro text je pro kočku (řádky 2 a 16 tvého CSS) Odkazy máš klikatelné jen v místě, kde je text. Co třebas takto? http://kod.djpw.cz/jneb- http://kod.djpw.cz/jneb Marschmallow: „Třeba takhle?“ Raději ne. Neprojeví se horní/dolní padding položek, položky jsou klikatelné jen v místě, kde je text. |
||
Časová prodleva: 11 let
|
0