Skocz do zawartości

  • 👋 Witaj na MPCForum!

    Przeglądasz forum jako gość, co oznacza, że wiele świetnych funkcji jest jeszcze przed Tobą! 😎

    • ✅ Pełny dostęp do działów i ukrytych treści
    • ✅ Możliwość pisania i odpowiadania w tematach
    • ✅ System prywatnych wiadomości
    • ✅ Zbieranie reputacji i rozwijanie swojego profilu
    • ✅ Członkostwo w jednej z największych społeczności graczy

    👉 Dołączenie zajmie Ci mniej niż minutę – a zyskasz znacznie więcej!

    Zarejestruj się teraz

Inne wymiary strony na pc i inne na telefonie

MsPatryk

Rekomendowane odpowiedzi

MsPatryk Pasjonat

MsPatryk

Opublikowano
Pasjonat

MsPatryk

Opublikowano

Cześć wie ktoś jak w css nadac wymiary tylko dla telefonów [jakaś rozdzielczość] i tylko dla pc? dwa osobne rozmiary ze wzgledu na inny wyglad na telefonie. Uzywam boostrapa :P

Burned123 Weteran

Burned123

Opublikowano
Weteran

Burned123

Opublikowano

Używając bootstrapa nie wiedząc przy tym co to media queries to słaby pomysł. Bootstrap (i inny fw) to nie jest ułatwienie dla osób, które nie znają html/css tylko dla tych co znają już dobrze i są leniami aby ciągle wypisywać te same klasy w każdym projekcie ;v

nielotweb Nowicjusz

nielotweb

Opublikowano
Nowicjusz

nielotweb

Opublikowano

Jeśli chodzi o bootstrap'a to masz już gotowe wszystko. Musisz tylko znaleźć dane style odpowiadające za daną rozdzielczość. 

 

Mogę Ci powiedzieć, jak to zrobić bez bootstrap'a ( w sumie w bootstrapie jest tak samo chyba :P ).

 

Żeby przykładowo wyświetlić dane obiekty w danej rozdzielczości możesz posłużyć, w sumie musisz tym kodem:

 

@media only screen and (max-width: 900px) { //divy }
 

I tutaj masz obiekty wyświetlane do maksymalnej szerokości ekranu 900px, czyli na przykład możesz dać menu wysuwane ( np. kwadracik który klikniesz po czym wysunie Ci się menu )

 

Jeśli chodzi o minimalną szerokość to ten sam kodzik, tylko zamiast max- to min- .

Jeśli chcesz rozdzielczości pomiędzy, czyli np. dany obiekt ma się wyświetlić pomiędzy 650px rozdzielczości ekranu a 760px to możesz użyć taki kodzik:

 

@media screen and (min-width: 650px) and (max-width: 768px)

 

I w sumie to jest tyle, a i nie zapomnij w sekcji <head> </head>  w głównym pliku strony dodać ten kodzik:

 

<meta name="viewport" content="width=device-width">

To odpowiada za prawidłowe wyświetlanie strony na różnych rozdzielczościach. :)

Jakub Specjalista

Jakub

Opublikowano
Specjalista

Jakub

Opublikowano

 

(...)dla tych co znają już dobrze i są leniami aby ciągle wypisywać te same klasy w każdym projekcie ;v

Prędzej bym powiedział, że dla ludzi, którzy zajmują się tym zawodowo i jeśli mogą zrobić coś przy użyciu fw w tydzień zamiast w 3 tygodnie przy użyciu czystego kodu, to z tego korzystają. Tutaj lenistwo nie ma nic wspólnego z korzystaniem z fw'ków.

MrSix Nowicjusz

MrSix

Opublikowano
Nowicjusz

MrSix

Opublikowano

To jest kod odpowiedzialny za szerokość strony na komputerze...

@media screen {
width: 1234px; //szerokość
}

...a to na mobilnych.

@media handheld {
width: 123px; //szerokość
}

Zarchiwizowany

Ten temat przebywa obecnie w archiwum. Dodawanie nowych odpowiedzi zostało zablokowane.

Tematy
×
×
  • Dodaj nową pozycję...