| Autor | Zpráva | ||
|---|---|---|---|
| Annie Profil |
#1 · Zasláno: 27. 11. 2014, 14:57:09
...mám v tomhle tématu asi milion otázek, takže pokud by tu byl někdo ochotný a znalý, kdo by o tom mohl dát řeč, budu velmi ráda.. :) Pokud ne, tak minimálně potřebuju pomoct s otázkou co se týče videí(tabulek, větších obrázků,...) - jakým stylem zadám to, aby se mi, např. na mobilu, nejenom přeskupily pod sebe (snažím se pomocí bootstrapu), ale hlavně aby se mi již zmíněné věci zmenšily...
|
||
| Str4wberry Profil |
#2 · Zasláno: 27. 11. 2014, 15:00:05
Odpovědi na všechny uvedené problémy byste mohla najít v článku: Responsivní design webu
Co s tabulkami, obrázky a videem se konkrétně věnuje pasáž: Responsivní design webu » HTML výjimky |
||
| jefitto44 Profil |
#3 · Zasláno: 27. 11. 2014, 15:31:44
Hlavné je pochopiť základ... a o tom sa dočítaš trebárs tu: http://brm.sk/485/ako-na-responsive-design
Čo sa týka tabuliek, obrázkov a videi, tak platí, že ak im zadáš nejakú width, tak výška sa automaticky prispôsobí. Osobne používam na všetky tieto srandy display:block;, samozrejme netvrdím, že je to vždy najlepšie riešenie, ale potom sa obrázok správa ako div a dá sa s ním pohybovať, dá sa marginovať atď atď... Takže treba len skúšať a skúšať... Osobne mi bootstrap nikdy moc nešiel, napriek tomu si myslím, že svojou cestou dokážem vyprodukovať aj tak stále dosť dobré responsivy |
||
| Annie Profil |
#4 · Zasláno: 28. 11. 2014, 11:41:36
Abych se přiznala, tak to čtu, ale pořád to moc nechápu :( resp. vždycky když si myslím, že jsem to pochopila, tak to zkusím a je to zase špatně... obávám se, že většina je způsobená marginem/paddingem.. a tím, že mám pevně nastavený šířky objektů - jenže když tyhle věci nebudu mít, tak to bude špatně vypadat na větších obrazovkách..
|
||
| Str4wberry Profil |
#5 · Zasláno: 28. 11. 2014, 12:33:31
Můžete to řešit uváděním rozměrů
marginů/paddingů v procentech, takže se přizpůsobí velikosti stránky a snadno tuto hodnotu odečtete od max-width.
Ukázka Případně pro různé šířky obrazovek použít různé styly: Responsivní design webu » Media queries |
||
| jefitto44 Profil |
#6 · Zasláno: 28. 11. 2014, 12:57:09
Nechecš dať rovno odkaz na tvoju stranku?
Box-sizing ti hodne pomôže, vyrieši problemy s prečnievajucimi divkami kvôli paddingom a borderom... A nič ti nebráni cez media queries nastaviť percentá len pre malé displaye |
||
| Tomáš123 Profil |
jefitto44:
„Box-sizing“ Box-sizing nefunguje vo všetkých prehliadačoch rovnako, lepšie je používať dvojité obaľovanie:
<div class="obal"> <!-- tomuto divu určíme rozmery -->
<div class="obsah"> <!-- a tomuto odsadenie -->
<p>Výplň divu</p>
<img src="nejaky-obrazok.jpg">
</div>
</div>Uvedené riešenie by malo byť spoľahlivejšie ako box-sizing.
|
||
| Str4wberry Profil |
#8 · Zasláno: 28. 11. 2014, 14:29:18
Box-sizing funguje od Internet Exploreru 8, to, myslím, u většiny webů stačí.
Jinak box-sizing sice řeší padding a border, margin ale už ne.
|
||
| jefitto44 Profil |
#9 · Zasláno: 30. 11. 2014, 18:56:20
Kto na mobile používa IE 8 a menej? Box sizing si nastaví len pre mobily a tablety a tie to poznajú
|
||
|
Časová prodleva: 9 let
|
|||
0