Avatar
Jan Václavík:6. března 14:54

Ahoj, kóduji šablonu webu z PSD podobné layoutu jako na na obrázku. Velikosti písma, obrázků, paddingy(jen přibližně) jsem z návrhu přepsal do css ale ten je dělaný v 1920px a já teď nevím jak dál postupovat abych docílil plně responzivního webu. Mohl by mi někdo prosím poradit jak udělat CSS webu tak aby vypadalo na 1200px nebo 800px stejně dobře jako na 1920px. Media Queries používám ale jde mi spíš o nějaký model poměru font-size a pod.

Děkuju

 
Odpovědět 6. března 14:54
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:6. března 15:41

google = bootstrap css
google = bootstrap layout demo
To je kompletni desing vytvoreny pro ruzne pomery. Je to zalozene na 12 sloupcech. Pomoci class si pak nastavujes, pro 4 ruzne sirky obrazovky, kolik pouzijes sloupcu.

Napr
https://v4-alpha.getbootstrap.com/…s/offcanvas/
(zobrazit zdrojovy kod)
col-12 col-md-9 = vsechna zarizeni 12 sloupcu, md a vetsi jen 9 (cili od md velikosti bude sede Hello word zabirat 9 sloupcu. A kdyz budes zmensovat sirku pod md, tak se roztahne pres celou sirku obrazovky, 12 sloupcu)
https://getbootstrap.com/…layout/grid/
md = 576px - 768px

Nemusis BT pouzivat, muzes si stahnout ne-mini-fikovanou verzi a vykopirovat si jen tu cast css, ktera resi layouty. Pozor, je to tam asi 3x, neco definuje vnitrni .col na procenty. Musis zvazit, co z toho vyuzijes.

Jo, sirku 1900 to nezna, ale slo by to css doupravit. To snadno pochopis.

Editováno 6. března 15:42
Akceptované řešení
+20 Zkušeností
+1 bodů
Řešení problému
 
Nahoru Odpovědět 6. března 15:41
Avatar
heydukfrantisek:13. března 5:52

A nestačilo by jenom nastavit hlavnimu elementů nastavit šířku 100% a písmu nastavit relativní hodnoty em?

Editováno 13. března 5:54
 
Nahoru Odpovědět 13. března 5:52
Avatar
Jan Václavík:21. března 22:23

Pro budoucí návštěvníky vlákna. Fontsize jsem to vyřešil takto --> https://css-tricks.com/…-typography/ a s layoutem jsem si pohrál s col viz: https://getbootstrap.com/…layout/grid/#… . Zúčastněným děkuji za pomoc

 
Nahoru Odpovědět 21. března 22:23
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 4 zpráv z 4.