Test 2: Różnice pomiędzy wersjami
Przejdź do nawigacji
Przejdź do wyszukiwania
Linia 1: | Linia 1: | ||
<html> | <html> | ||
− | + | <head> | |
− | + | <style> | |
− | + | /* ------------------------CZĘŚĆ-GÓRNA-MENU------------------------ */ | |
− | + | /* OTWARCIE LISTY */ | |
− | + | ol.MenuRozwijane { | |
− | + | list-style-type:none; /* Żeby nie było numeracji ani wypunktowania dla listy */ | |
− | + | list-style-image:none; /* Żeby nie było numeracji ani wypunktowania dla listy */ | |
− | + | padding:0; /* Brak odstępów między komórkami (główna część listy) */ | |
− | + | margin:0; /* Brak odstępów między komórkami (główna część listy) */ | |
+ | } | ||
− | + | ol.MenuRozwijane:hover { | |
− | + | } | |
− | + | ||
− | + | /* GLOBALNE USTAWIENIA ZNACZNIKA <a> W CAŁEJ LIŚCIE */ | |
− | + | ol.MenuRozwijane a { | |
− | + | display:block; /* Sposób wyświetlania */ | |
+ | text-decoration:none; /* Usunięcie podkreśleń tekstu (np. linków) gdy nie zaznaczone - to jest domyślne dla wszystkich elementów listy */ | ||
+ | } | ||
− | + | /* POSZCZEGÓLNE KOMÓRKI W PIERWSZYM WIERSZU - Z NICH BĘDZIE ROZSUWANIE MENU */ | |
− | + | ol.MenuRozwijane > li { | |
− | + | font-weight: bold; /* Pogrubienie tekstu */ | |
− | + | float:left; /* Menu poziome */ | |
− | + | background-color: #EEEEEE; /* Domyślny kolor listy */ | |
− | + | height: 1em; /* Niezbędne, by lista się wysuwała a nie powiększała całą belkę */ | |
− | + | line-height: 0.75em; | |
− | + | } | |
− | + | /* POSZCZEGÓLNE KOMÓRKI W PIERWSZYM WIERSZU - Z NICH BĘDZIE ROZSUWANIE MENU (PO NAJECHANIU NA NIEGO KURSOREM) */ | |
− | + | ol.MenuRozwijane > li:hover { | |
− | + | } | |
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | + | /* WYGLĄD TEKSTU W PIERWSZYM WIERSZU W ZNACZNIKU <a> */ | |
− | + | ol.MenuRozwijane > li > a { | |
− | + | } | |
− | |||
− | |||
− | + | /* WYGLĄD TEKSTU W PIERWSZYM WIERSZU W ZNACZNIKU <a> (PO NAJECHANIU NA NIEGO KURSOREM)*/ | |
− | + | ol.MenuRozwijane > li > a:hover { | |
− | + | text-decoration:underline; /* Podkreślenie przy zaznaczeniu - trzeba zmienić także "ol.MenuRozwijane > li > ul > li:hover > a" */ | |
− | + | } | |
− | |||
− | |||
− | |||
− | + | /* CZĘŚĆ ROZWIJANA MENU */ | |
− | + | /* UKRYCIE LISTY ROZWIJANEJ, GDY NIE ZAZNACZAMY PIERWSZEGO ELEMENTU */ | |
− | + | ol.MenuRozwijane > li > ul { | |
− | + | list-style-type:none; /* Żeby nie było numeracji ani wypunktowania dla listy */ | |
− | + | list-style-image:none; /* Żeby nie było numeracji ani wypunktowania dla listy */ | |
− | + | display:none; /* Ukrycie listy gdy niepotrzebna */ | |
− | + | padding:0px; /* Brak odstępów między pierwszym wierszem a rozwijaną listą*/ | |
− | + | margin:0px; /* Brak odstępów między pierwszym wierszem a rozwijaną listą*/ | |
+ | margin-top: 0.3em; | ||
+ | } | ||
− | + | /* LISTA WIDOCZNA PO NAJECHANIU NA PIERWSZY ELEMENT */ | |
− | + | ol.MenuRozwijane > li:hover > ul { | |
− | + | display:block; /* Wysunięcie listy */ | |
− | + | } | |
− | |||
− | |||
− | |||
− | |||
− | |||
− | + | /* WYGLĄD POSZCZEGÓLNYCH WIERSZY W LIŚCIE ROZWINIĘTEJ */ | |
− | + | ol.MenuRozwijane > li > ul > li { | |
− | + | list-style-type:none; /* Żeby nie było numeracji ani wypunktowania dla listy */ | |
− | + | list-style-image:none; /* Żeby nie było numeracji ani wypunktowania dla listy */ | |
+ | background-color: #EEEEEE; /* Domyślny kolor listy */ | ||
+ | padding:0px; /* Brak odstępów między komórkami (rozwijana lista) */ | ||
+ | margin:1px; /* Brak odstępów między komórkami (rozwijana lista) */ | ||
+ | border-style: solid; | ||
+ | border-width: 1px; | ||
+ | } | ||
+ | |||
+ | /* WYGLĄD POSZCZEGÓLNYCH WIERSZY W LIŚCIE ROZWINIĘTEJ (PO NAJECHANIU KURSOREM) */ | ||
+ | ol.MenuRozwijane > li > ul > li:hover { | ||
+ | } | ||
+ | |||
+ | /* WYGLĄD TEKSTU W ZNACZNIKU <a> W LIŚCIE ROZWINIĘTEJ */ | ||
+ | ol.MenuRozwijane > li > ul > li > a { | ||
+ | } | ||
− | + | /* WYGLĄD TEKSTU W ZNACZNIKU <a> W LIŚCIE ROZWINIĘTEJ (PO NAJECHANIU KURSOREM) */ | |
− | + | ol.MenuRozwijane > li > ul > li:hover > a { | |
− | + | text-decoration:underline; /* Podkreślenie przy zaznaczeniu - trzeba zmienić także "ol.MenuRozwijane > li > a:hover" */ | |
− | + | } | |
− | + | /* WYGLĄD POSZCZEGÓLNYCH KOMÓREK W LIŚCIE ROZWINIĘTEJ PO ZAZNACZENIU TEJ LISTY */ | |
− | + | ol.MenuRozwijane > li:hover > ul > li { | |
− | + | position: relative; left: z-index: 99999; /* Ta część jest po to, żeby lista była zawsze na wierzchu */ | |
− | + | } | |
− | + | ||
− | + | /* WYGLĄD POSZCZEGÓLNYCH KOMÓREK W LIŚCIE ROZWINIĘTEJ (PO NAJECHANIU KURSOREM) PO ZAZNACZENIU TEJ LISTY */ | |
− | + | ol.MenuRozwijane > li:hover > ul > li:hover { | |
− | + | } | |
− | + | </style> | |
− | + | </head> | |
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
</html> | </html> | ||
− | <table width='100%' frame='box' style='border: solid 1px #555555; | + | <table width='100%' frame='box' style='border: solid 1px #555555;' style='vertical-align: middle;'> |
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
<tr> | <tr> | ||
− | <td width='33%' align='left' style='background-color: #EEEEEE'>'''[[Arbok|#24 Arbok]]'''</td> | + | <td width='33%' height=1em align='left' style='background-color: #EEEEEE;'>'''[[Arbok|#24 Arbok]]'''</td> |
− | <td width='33%' align='center' style='background-color: #EEEEEE'>'''#25 Pikachu ([[Lista Pokemonów]])'''</td> | + | <td width='33%' height=1em align='center' style='background-color: #EEEEEE;'>'''#25 Pikachu ([[Lista Pokemonów]])'''</td> |
− | <td width='33%' align='right' style='background-color: #EEEEEE'> | + | <td width='33%' height=1em align='right' style='background-color: #EEEEEE;'> |
<html> | <html> | ||
− | |||
<ol class="MenuRozwijane"> | <ol class="MenuRozwijane"> | ||
− | <li style="width: | + | <li style="width:72%"> |
+ | |||
+ | </li> | ||
+ | <li style="width:28%" align="right"><a href="https://pokelife.pl/pokedex/index.php?title=Rotom" align="center">#479 Rotom </a> | ||
<ul> | <ul> | ||
− | <li style="width: | + | <li style="width:100%" align="right"><a href="https://pokelife.pl/pokedex/index.php?title=Rotom_B" align="center">#479 Rotom B</a></li> |
− | <li style="width: | + | <li style="width:100%" align="right"><a href="https://pokelife.pl/pokedex/index.php?title=Rotom_C" align="center">#479 Rotom C</a></li> |
− | <li style="width: | + | <li style="width:100%" align="right"><a href="https://pokelife.pl/pokedex/index.php?title=Rotom_D" align="center">#479 Rotom D</a></li> |
− | <li style="width: | + | <li style="width:100%" align="right"><a href="https://pokelife.pl/pokedex/index.php?title=Rotom_E" align="center">#479 Rotom E</a></li> |
− | <li style="width: | + | <li style="width:100%" align="right"><a href="https://pokelife.pl/pokedex/index.php?title=Rotom_F" align="center">#479 Rotom F</a></li> |
</ul> | </ul> | ||
</li> | </li> | ||
</ol> | </ol> | ||
− | |||
</html> | </html> | ||
Linia 144: | Linia 123: | ||
</table> | </table> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
<table width='100%'> | <table width='100%'> |
Wersja z 02:15, 16 lip 2017
#24 Arbok | #25 Pikachu (Lista Pokemonów) |
|
|