Autor | Zpráva | ||
---|---|---|---|
Freak Profil * |
#1 · Zasláno: 30. 11. 2018, 21:43:03
Zdravím,
přemejšlím aktuálně nad variantou, jak vyřešit způsob, kdy mám vedle sebe 16x <div>, resp. mám jich 8 na jednom řádku a 8 na druhém řádku. A řeším věc, kdy chci aby každý druhý div byl šedý, ale na druhém řádku, aby to vypadalo dobře, tak byl první div šedý a následně každý druhý. Tzn. nějak takto: ibb.co/j8TjYgT Děkuji moc za radu |
||
Keeehi Profil |
#2 · Zasláno: 30. 11. 2018, 22:24:39
Freak:
Tak těm co chceš aby byly šedé přidej nějakou třídu. Kde je problém? |
||
Freak Profil * |
#3 · Zasláno: 30. 11. 2018, 22:58:16
Keeehi:
No a jak v tu chvíli řešit responzivitu? |
||
DarkMeni Profil |
To responzivitu neovlivní. Nebo záleží jak je to řešené teď.
Případně existují pseudo-třídy :nth-child nebo :nth-of-type, ale zatím asi nebudou mít moc dobrou podporu, v nejnovějších Firefoxech a Chromech by to mohlo fungovat. .kontejner:nth-child(odd) { background: ... } /* nebo */ .kontejner:nth-child(2n) { background: ... } /* nebo liché */ .kontejner:nth-child(2n+1) { background: ... } Něco takového <!DOCTYPE HTML> <html> <head> <title>nth-of-type</title> </head> <body> <style type="text/css"> .row div { width:100px; height:100px; display:inline-block; } .row:nth-of-type(2n) div:nth-of-type(2n+1) {background: Gray;} .row:nth-of-type(2n+1) div:nth-of-type(2n) {background: Gray;} </style> <div class="row"> <div></div> <div></div> <div></div> <div></div> </div> <div class="row"> <div></div> <div></div> <div></div> <div></div> </div> </body> </html> A pro responzivitu je lze dát všechny do 1 kontejneru s šířkou třeba 90% (odstranit řádky), čtvercům nastavit display:inline-block nebo float:left a řádky si to vytvoří samo. A pak i ten selektor může být mnohem jednodušší, prostě vybarvit každý lichý nebo sudý čtverec. |
||
Keeehi Profil |
#5 · Zasláno: 30. 11. 2018, 23:41:19
„No a jak v tu chvíli řešit responzivitu?“
To přece záleží na zvoleném řešení responzivity. Ale obecně platí že bude někde nějaký breakpoint při kterém se ty dlaždice přeskládají. Při té příležitosti se mohou i přebarvit. Některé dlaždice budou mít více tříd a z těchto tříd budou aktivní jen některé při určitých breakpointech. |
||
Kajman Profil |
#6 · Zasláno: 1. 12. 2018, 07:36:15
Když se bude dávat na řádek vždy lichý počet, tak to vyjde i při obyčejném střídání lichá - sudá.
|
||
Mlocik97m Profil * |
#7 · Zasláno: 1. 12. 2018, 08:56:16
DarkMeni:
podpora je v pohode,... vid caniuse |
||
Časová prodleva: 5 let
|
0