Безплатно! Онлайн събитие: От претоварване с информация до фокус и структура с Gemini & NotebookLM Регистрация тук.
Преизползване на стилове
Пълен достъп до курса: Не
За пълен достъп или безплатна проба (2 модула), моля влезте или се регистрирайте.
Най-важното: преизползвай, не копирай CSS
Една от най-големите сили на CSS е преизползването на стилове чрез групиране на селектори и каскадиране. Вместо да копираш един и същ код за сходни елементи, можеш да дефинираш общите стилове на едно място и да променяш само различията. Така кодът става по-кратък, по-четим и по-лесен за поддръжка.
Стъпка по стъпка: втори progress bar с различен цвят
- Създай втори елемент, например
progress-bar-yellow. - В CSS групирай селекторите на двата progress bar-а, като ги разделиш със запетая, за да споделят общите стилове (височина, ширина, рамка, фон с шарка).
- Задай ширина (например 25%), за да се подредят един до друг.
- Напиши отново селектора за жълтия progress bar.
- В него дефинирай само различните стилове – например нов
backgroundс жълт градиент. - Ако е нужно, промени само
border-color, вместо да презаписваш цялата рамка.
Така използваш каскадирането, за да надграждаш върху вече съществуващи стилове.
Използвани CSS техники
selector1, selector2– групиране на селектори за споделени стиловеbackground– задаване на градиент и шаркаborder– дефиниране на рамкаborder-color– промяна само на цвета на рамкатаwidth– контрол на ширината (напр. 25%)
Този подход ти позволява да редактираш общите параметри само на едно място и да поддържаш кода чист и ефективен.
