Media Query

Odpowiedz Nowy wątek
2020-01-28 12:26

Rejestracja: 5 lat temu

Ostatnio: 2 dni temu

0
@media (min-width: 1600px) {
   .slider > a:hover {
      color: white;
      background-color: red;
   }
}

Na 1600 nic się nie dzieje. Dopiero jak dam 1500 to kod się wykona. Tylko dlaczego? skoro moja rozdzielczość ekranu to 1920x1080.

edytowany 1x, ostatnio: cerrato, 2020-01-28 13:54

Pozostało 580 znaków

2020-01-28 12:46

Rejestracja: 3 miesiące temu

Ostatnio: 4 godziny temu

0

o czym ty mówisz? to jest ustawione że od 1600px ma się ten styl wykonać. Aby zobaczyć ile aktualnie ekran ma pikseli włącz f12 i włącz tryb mobile.I tam będzie widać w prawym górnym rogu okna (w chrome).

Pozostało 580 znaków

2020-01-28 12:59

Rejestracja: 5 lat temu

Ostatnio: 2 dni temu

0

Sprawdziłem na stronie https://www.mydevice.io/ swoją rodzielczość - 1536px. tylko dlaczego? Skoro mam 1920x1080.

edytowany 1x, ostatnio: Toficjusz, 2020-01-28 13:26

Pozostało 580 znaków

2020-01-28 13:34

Rejestracja: 2 lata temu

Ostatnio: 3 godziny temu

1

Sprawdź czy nie masz czasem włączonego powiększenia ekranu w systemie.

Pozostało 580 znaków

2020-01-28 13:51

Rejestracja: 5 lat temu

Ostatnio: 2 dni temu

0

Faktycznie miałem włączone skalowanie 125%. Po ustawieniu na 100% wykryta rozdzielczość 1920x1080.
To jeszcze jedno pytanie - po włączeniu narzędzia DevTools w Chrome i przejściu w tryb mobilny ustawiłem sobie rozdzielczość 1920x1080 i zoom ustawiłem na 75%. Czy ten zoom odpowiada tylko za wyświetlany obszar roboczy czy wpływa też na elementy, czcionki na mojej stronie i zmniejsza je do 75%?

Pozostało 580 znaków

2020-01-28 13:57

Rejestracja: 2 lata temu

Ostatnio: 3 godziny temu

0

Z tego co się orientuje jest to tylko wizualny zoom.

Pozostało 580 znaków

2020-01-28 14:00

Rejestracja: 5 lat temu

Ostatnio: 2 dni temu

0

Ktoś jeszcze potwierdzi?

Pozostało 580 znaków

2020-01-28 14:03

Rejestracja: 4 miesiące temu

Ostatnio: 1 godzina temu

1

potwierdzam

Pozostało 580 znaków

2020-01-28 14:04

Rejestracja: 8 lat temu

Ostatnio: 2 godziny temu

0

Tak, tamten zoom jest tylko po to żeby móc np. zobaczyć cały obszar w mniejszym oknie.
A poza skalowaniem systemu to na wielkość obszaru roboczego ma też np. szerokość paska przewijania. Bo liczy się tylko ten obszar, który wyświetla stronę, a nie rozdzielczość ekranu w komputerze.


Wszystkie miejsca, w których mnie znajdziesz w internecie: https://codewin.pl
Ekologiczne podejście do aplikacji? Dołącz do mojej przyszłorocznej inicjatywy: https://ekoapps.pl

Pozostało 580 znaków

2020-01-28 14:26

Rejestracja: 5 lat temu

Ostatnio: 2 dni temu

0

I jak sobie radzicie z takim obszarem jak właśnie pasek przewijania, górna belka przeglądarki... w DevTools tego nie ma.

Pozostało 580 znaków

2020-01-29 23:24

Rejestracja: 5 lat temu

Ostatnio: 2 dni temu

0
body > header {
      display: flex;
      flex-direction: row;
      height: 100vh;
      width: 100%;
      background-image: url(../images/tlo1.jpg);
      background-repeat: no-repeat;
      background-size: cover;
      background-position: bottom center;
   }

nav {
   min-height: 9vh;
   width: 100%;
}

screenshot-20200129232015.png

Dlaczego header (zdjęcie faceta) nie wypełnia całego okna telefonu?

edytowany 1x, ostatnio: cerrato, 2020-01-30 09:08

Pozostało 580 znaków

Odpowiedz

1 użytkowników online, w tym zalogowanych: 0, gości: 1, botów: 0