• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Dostosowanie strony do monitora HD i FHD

0 głosów
79 wizyt
pytanie zadane 11 maja 2017 w HTML i CSS przez kevin Gaduła (4,680 p.)
Witam!

Czy jeżeli chcę napisać stronę to koniecznie potrzebuję monitora FHD żeby ją przystosować ? Rozmiary menu i innych elementów mam w jednostkach px i logiczne jest że jeżeli dla HD mam diva 250px to dla FHD też on będzie miał 250px ale z powodu wyższej rozdzielczości będzie on mniejszy bo to więcej pixeli na tej samej powierzchni w przypadku monitorów o tej samej ilości cali. Jak sobie z tym radzić ? Powinienem uwzględnić to poprzez @media i dla każdej rozdzielczości dać inne rozmiary divów ?

2 odpowiedzi

+1 głos
odpowiedź 11 maja 2017 przez niezalogowany
Wejdź sobie w Developer Tools i tam w Toggle device toolbar (Ctrl + Shift + M) możesz testować sobie różne rozdzielczości.
komentarz 11 maja 2017 przez kevin Gaduła (4,680 p.)
Rozumiem że tam ustawiam sobie rozdzielczość i skaluję stronę tak aby cała jej szerokość mieściła mi się na ekranie ?
0 głosów
odpowiedź 11 maja 2017 przez Lu Kiss Dyskutant (7,660 p.)
spróbuj na to spojrzeć inaczej

zamiast 250px wykorzystaj 25%

pracuję nad fajnym projektem i tylko w kilku elementach mam w px ustawioną wysokość, lub max-width

przykład - gabinety.deos.pl
komentarz 11 maja 2017 przez kevin Gaduła (4,680 p.)
Korzystając z Ctrl + Shift + M zwiększa się mi obszar roboczy a nie pokazuje to czytelności elementów... Przy rozmiarze czcionek też takie coś działa ? Używając % mam stu procentową pewność że strona czytelna na rozdzielczości HD będzie równie czytelna na rozdzielczości FHD ? % co do szerokości strony to jestem w stanie to sobie wyobrazić ponieważ szerokość jest albo dla HD albo FHD ale wartość procentowa dla elementu  np. height: 25% odnosi się do diva który zawiera ten element a ten odnosi się do całej strony a na wysokość całej strony wpływa kilka innych elementów które mają wysokość procentową czyli w pewnym sensie zależną od innych elementów, wniosek ? Jak to ogarnąć ? Ustawić diva width: 100% ( dla HD i FHD ) i np. height: 1000px i poustawiać elementy w tym divie żeby były czytelne ?
komentarz 11 maja 2017 przez Lu Kiss Dyskutant (7,660 p.)
zależy co chcesz zrobić :)

są różne sposoby na ustawianie wysokości elementu - vh / padding

dla fontów zastosuj np em

jeśli stosujesz media queries to prosty zabieg wystarczy zastosować

body {font-size: 120%} i wszystkie fonty się powiększą
komentarz 12 maja 2017 przez kevin Gaduła (4,680 p.)
W sensie ? Brzmi to tak jakby jedno rozwiązanie pasowało tylko i wyłącznie do jednego przypadku... em? Stosując em i ustawiając rozmiary poprzez padding mam tę skalowalność bo wtedy rozmiar elementu zależy od rozmiaru czcionki i wielkości elementu. Ale czy ustawienie rozmiaru czcionki poprzez em automatycznie zmieni mi jej wielkość kiedy ktoś ma monitor FHD ? Powoli zaczynam się obawiać że początkujący musi mieć monitor obsługujący wszystkie rozdzielczości żeby nie budzić się w nocy z powodu obaw o nieczytelną stronę w FHD... Ale nawet jak w media ustawię font-size: 120% to te 120% muszę skądś wziąć
komentarz 12 maja 2017 przez Lu Kiss Dyskutant (7,660 p.)
Obawiasz się nie istniejącego problemu, a co w takim razie na Mac gdzie masz 2x pikseli ? rozdzielczość np 2880px, a jak ktoś ma monitor 4k? albo UHD?

Projektujesz stronę na szerokość 1400px i tyle. jak ktoś ma większy ekran to ma więcej pustej przestrzeni po bokach.

Font o wielkości 1em (Twoje 100%) czyli 16px jest tak samo czytelny na smartfonie 4' jak i na ekranie FHD.
komentarz 14 maja 2017 przez kevin Gaduła (4,680 p.)
Właśnie o to chodzi, ja nie mam doświadczenia nie wiem co i jak i mam wątpliwości tego typu... mam stronę na width: 1200px na fhd będzie więcej miejsca po bokach. Ale martwi mnie ta czytelność... w body dla hd mam font-size 100% dla fhd np. 120% elementy co mają ustawiony padding zmienią swój rozmiar po zmianie wielkości czcionki. Font o wielkości 1em czyli moje 100%, nie bardzo rozumiem. Gdzieś muszę jakieś odniesienie do tego em wstawić żeby 1em to było 16px ? Skąd przeglądarka ma wiedzieć że 1em to 16px a nie 26px ?

Podobne pytania

0 głosów
0 odpowiedzi 29 wizyt
0 głosów
0 odpowiedzi 263 wizyt
0 głosów
2 odpowiedzi 5,398 wizyt
pytanie zadane 13 października 2016 w Sprzęt komputerowy przez Przemek Gaffka Początkujący (470 p.)
Porady nie od parady
Odznacz odpowiedź zieloną fajką, jeśli uważasz, że jest ona najlepsza ze wszystkich i umożliwiła ci rozwiązanie problemu.Najlepsza odpowiedź

66,513 zapytań

113,278 odpowiedzi

239,907 komentarzy

46,647 pasjonatów

Przeglądających: 216
Pasjonatów: 19 Gości: 197

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto dwie polecane książki warte uwagi. Pełną listę znajdziesz tutaj.

...