важните сили променят каскадата
Един от най-добрите начини да научите как да кодирате уеб сайтове е да разгледате изходните кодове на други сайтове. Тази практика е колко много специалисти по интернет са научили за своите занаяти, особено в дните, преди да има толкова много възможности за курсове за уеб дизайн , книги и онлайн сайтове за обучение.
Ако опитате тази практика и погледнете каскадните стилови листове (CSS) на сайта, едно нещо, което може да видите в този код, е ред, който казва, че е важно!
Какво означава това и, също толкова важно, как правилно използвате тази декларация в стиловите листове?
Каскадата на CSS
На първо място, важно е да се разбере, че каскадните листове за стилове действително са каскадни , което означава, че те са поставени в определен ред. По принцип това означава, че стиловете се прилагат в реда, в който се четат от браузъра. Първият стил се прилага, а след това втория и така нататък.
В резултат на това, ако даден стил се появи в горната част на листа с стилове и след това се промени по-ниско в документа, второто копие на този стил е вторият, а не първият. По принцип, ако два стила казват едно и също нещо (което означава, че те имат същото ниво на специфичност), ще се използва последната.
Например, нека си представим, че в стилов лист се съдържат следните стилове. Текстът на абзаца ще бъде изобразен в черно, въпреки че приложената първа собственост на стила е червена.
Това е така, защото вторият е избран за "черна" стойност. Тъй като CSS се чете отгоре надолу, последният стил е "черен" и затова той печели.
p {цвят: червен; }
p {цвят: черен; }
Важно! Променя приоритета
Сега, когато разбирате как тези почти идентични правила се обработват от CSS, можем да разгледаме как важната директива променя нещата малко.
Важната директива засяга начина, по който вашият CSS каскади , следвайки правилата, които смятате, че са най-важни и трябва да бъдат приложени. Правило, което има важната директива, винаги се прилага, независимо от това къде това правило се появява в документа за CSS.
За да направите текста на абзаца винаги червен, от горния пример ще използвате:
p {цвят: червен! важно; }
p {цвят: черен; }
Сега целият текст ще се появи в червено, въпреки че "черна" стойност е вторият. Важната директива препятства нормалните правила на каскадата и дава на този стил много висока специфика.
Ако абсолютно е необходимо параграфите да изглеждат червени, този стил ще го направи, но това не означава, че това е добра практика. Нека да видим кога може да искате да използвате! Важно и кога не е подходящо.
Кога да използвате! Важно!
Важната директива е много полезна, когато тествате и отстранявате грешки в уебсайт. Ако не сте сигурни защо не се прилага стил и мислите, че това може да е проблем с конкретността, можете да добавите важната декларация към вашия стил, за да видите дали това е поправено.
Ако добавянето! Важно наистина решава проблема със стила, току-що сте установили, че това е проблем с конкретността. Вие обаче не искате да оставяте този важен код, той е бил поставен само за целите на тестването.
Тъй като тестването е направено, сега трябва да премахнете тази директива и да коригирате своя селектор, за да постигнете спецификата, която ви е необходима, за да се сдобиете с вашия стил. Важно не би трябвало да навлиза във вашите производствени обекти, отчасти поради това, как се променя нормалната каскада.
Ако се наклоните прекалено на важната декларация, за да постигнете желаните от вас стилове, в крайна сметка ще имате стилен лист, пълен с важни стилове. Ще променяте фундаментално начина, по който се обработва CSS на страницата. Това е мързелива практика, която не е добра от гледна точка на дългосрочно управление.
Използвайте! Важно за тестване или, в някои случаи, когато абсолютно трябва да преодолеете вграден стил, който е част от рамка на тема или шаблон.
Дори и в тези случаи използвайте този подход възможно най-умело и вместо това се старайте да пишете чисти стилови листове, които разбират каскадата.
Стилове на потребителски стилове
Има една последна бележка относно важната директива, която е от съществено значение за разбирането. Директивата беше въведена също така, за да помогне на потребителите на уеб страници да се справят със стилните листове, които правят страниците трудни за използване или четене.
Обикновено, ако потребител дефинира стилов лист за преглед на уеб страници, този стилов лист е отхвърлен от стиловия лист на автора на уеб страницата. Ако потребителят маркира стил като важен, този стил надхвърля стиловия лист на автора на уеб страницата, дори ако авторът отбелязва правилото като важно!
Това е полезно за потребители, които трябва да определят стилове по определен начин. Например, може да се наложи някой да увеличи размера на шрифта по подразбиране на всички уеб страници, които използва. Използвайки Вашата важна директива педантично в рамките на страниците, които изграждате, отговаряте на всички специални нужди, които потребителите могат да имат.
Редактиран от Джеръми Жирар