Медийно устройство - как да се променят в зависимост от стила на резолюцията на екрана
В тази статия ще разгледаме как да се свържете с помощта на параметрите @media CSS стилове и да промените стила на извеждането на страници за различни видове устройства с различна разделителна способност (широчина) на екрана.
Видове устройства @media
В момента има общо 10 вида мултимедийни устройства:
Как да промените стила при смяна на ширината на екрана за различни мултимедийни устройства
Методи на свързване на CSS стилове:
Най-разпространеният начин да се свърже стилове - добавяне в секцията HEAD на код:
за всички или само за монитори:
Методът на втората връзка с помощта на вноса (@import) стил лист в секцията HEAD:
Как да промените CSS стила за мултимедийни устройства с различна разделителна способност (ширината на екрана)
За да промените стила на дисплея на страница на устройства с различна ширина (размер) на параметрите на екрана се използват медии. мин-макс ширина и ширина.
Те могат да бъдат използвани в секцията HEAD на страницата:
това сме определили лист със стилове за всички видове и за устройства с резолюция на 1280px и др. Възможна така че да се установи обхвата на ширината на екрана, за да се покрие определен стил на:
В допълнение, се определят стилове за устройствата могат да бъдат в списъка на стилове с вида на носителя: всички добавяне към дъното на неговите инструкции за всяко устройство:
@media печат<
#sidebar
#content> // стил за отпечатване на документ, скрита лента и съдържание, се удължава до края на страницата
@media (макс ширина: 799px) и (мин ширина: 300px) <
#content
#sidebar> // стил за мобилни телефони и Ipad с разделителна способност от 300 до 799px, като съдържанието му е удължен до края на страницата и съдържанието на страничната лента се поставя под
@media (мин-ширина: 1279px) #page> // за монитори с разделителна способност на екрана по-висока от 1280px ние забранен участък на дизайна на сайта ни е по-широка гума 1240px
Попитайте защо тези инструкции, за да го добавите надолу стилове - за тези инструкции за всеки тип rerecorded стил, определен за елементите в основната част на документа за CSS.