Jaka jest różnica między „ekranem” i „tylko ekranem” w zapytaniach dotyczących mediów?
Ten post wyjaśni, co odróżnia „ekran” od „tylko ekranu” w zapytaniach dotyczących mediów.
Co odróżnia „ekran” od „tylko ekranu” w zapytaniach dotyczących mediów?
"ekran”Jest wykorzystywany do ustawiania rozmiaru ekranu wewnątrz zapytania multimedialnego. W szczególności rozmiar ekranu można ustawić za pomocą „maksymalna szerokość" I "Min szerokość”Właściwości CSS. Rozmiar ekranu różni się w zależności od ekranu. Tak więc „jedyne” słowo kluczowe jest zatem ustalane w celu zapobiegania wcześniejszymi przeglądarkami korzystania z dostarczonych stylów, ponieważ nie obsługują zapytań multimedialnych zawierających funkcje multimediów.
Jak korzystać z zapytań medialnych „ekranu”?
Aby wykorzystać „ekran”W zapytaniu multimedialnym sprawdź wymienione instrukcje.
Krok 1: Wstaw nagłówek
Najpierw użyj znacznika nagłówka HTML, aby dodać nagłówek do dokumentu HTML. Na przykład „„ Krok 2: Dodaj tekst w akapicie Następnie dodaj tekst w akapicie za pomocą „ Zastosuj regułę @Media Ustawiliśmy szerokość ekranu. Wyjście Krok 3: Zastosuj styl na element „ciała” Uzyskaj dostęp do elementu ciała i zastosuj właściwości CSS do stylizacji: Aby to zrobić, „kolor tła„Własność jest wykorzystywana do przydzielania koloru na tylnej części elementu. Krok 4: Ustaw „Ekran @Media” Zgodnie z naszymi wymaganiami ustawiliśmy szerokość dokumentu na „300„Piksels lub mniej. Kolor tła to „LightkyBlues". Jeśli nie, będzie to „zielony". Aby to zrobić, skorzystaj z „@Media ekran”I ustaw maksymalną szerokość ekranu. Następnie uzyskaj dostęp do ciała i zastosuj następujące właściwości CSS: Tutaj: Wyjście Jak korzystać z zapytań medialnych „Tylko ekran”? „„tylko„Słowo kluczowe ogranicza przeglądarki do zastosowania określonych stylów, które nie są obsługiwane przez zapytania medialne z funkcjami multimedialnymi. Postępuj zgodnie z instrukcjami, aby wykorzystać „Tylko ekran„W zapytaniach medialnych. Krok 1: styl „Body” Uzyskaj dostęp do ciała i zastosuj „kolor tła”Aby określić kolor z tyłu elementu na ekranie. Krok 2: Zastosuj zapytanie o „tylko ekran” Teraz zastosuj zapytanie medialne z „Tylko ekran„Aby ustawić szerokość ekranu. Za to wartość „Tylko ekran„Własność jest ustalona jako„400px". Krok 3: Ustaw właściwość „koloru tła” Kiedy ustawiamy szerokość dokumentu, aby „400„Piksele lub mniej, kolor tła to„RGB (17, 97, 202)". W przeciwnym razie jest to „RGB (235, 185, 23)". Wyjście Chodzi o rozróżnienie między ekranem zapytań multimedialnych a ekranem. Wniosek Rozróżnienie między „Tylko ekran" I "ekran„W zapytaniach medialnych jest to, że„ekran”Jest stosowany do wskazania rozmiaru ekranu zapytania multimedialnego. „„maksymalna szerokość" I "Min szerokość”Można użyć do kontrolowania rozmiaru ekranu. Ponieważ każdy ekran ma wyraźny rozmiar ekranu, „tylko„Słowo kluczowe służy do uniknięcia wdrażania określonych stylów we wcześniejszych przeglądarkach, które nie dopuszczają zapytań multimedialnych. Ten post wyjaśnił rozróżnienie między „tylko ekranem” a „ekranem” w zapytaach medialnych.
kolor tła: zielony;
ciało
kolor tła: LightkyBlues;
Kolor: RGB (226, 12, 12);
Ponownie uzyskuj dostęp do ciała i zastosuj ”kolor tła" Ponownie:
kolor tła: RGB (235, 185, 23);
@Media tylko ekran i (maksymalna szerokość: 400px)
ciało
kolor tła: RGB (17, 97, 202);