Що нового?

Придбаний [HTML Academy] Анатомія CSS-каскаду

Інформація про покупку
Тип покупки: Складчина
Ціна: 3640 ГРН
Учасників: 0 з 74
Організатор: Відсутній
Статус: Набір учасників
Внесок: 51.2 ГРН
0%
Основний список
Резервний список

Gadzhi

Модератор

Зі звичайного фронтендера в техліда

Перевірте, чи підійде вам цей курс, відповівши на одне з питань для співбесіди фронтенд-інженера в IBM

Яким буде значення властивості background-color в першому і в другому варіанті і чому?
Спробуйте відповісти самі, а потім порівняйте свої відповідь і пояснення з авторськими.
/* Варіант 1 */

:root {
--not-a-color: 20px;
}

p {
background-color: red;
}

p {
background-color: var(--not-a-color);
}


/* Варіант 2 */

p {
background-color: red;
}

p {
background-color: 20px;
}
Натисніть, щоб розкрити...
програма курсу

Курс проходить в асинхронному форматі. Це означає, що ви можете почати навчання в будь-який час і рухатися за програмою з комфортною вам швидкістю.

Проходження курсу займе від 2 до 3 тижнів, якщо ви готові займатися 5 годин на тиждень.

Розділ 1. Обробка значень і каскад
Розглянемо поняття каскаду і обробки значень. Розберемося, як браузер обчислює значення, і в який момент запускається каскад.

теорія
  • поняття каскаду.
  • обчислення значень: стадії declared, cascaded, specified, computed, used і actual.
Практика
  • контрольні тести за темами розділу
Розділ 2. Фільтрація

Поговоримо про стилі автора, користувача і браузера, а також про "віртуальних" стилях. Розберемо, як браузер парсит CSS-код, фільтрує оголошення і відбирає значення. Торкнемося валідності, префіксів, псевдонімів, умовних правил і пошуку елементів в Dom-дереві.

теорія
  • джерела стилів: авторські, браузерні і призначені для користувача.
  • Парсинг і фільтрація.
Практика
  • контрольні тести за темами розділу
Розділ 3. Каскад

Детально розглянемо порядок оголошення властивостей і каскадування. Розберемося з тим, як відбувається розрахунок специфічності селекторів і яку роль вона відіграє в каскаді.

теорія
  • детальний розбір алгоритму каскаду.
  • Порядок підключення стильових файлів і оголошення властивостей.
  • Порядок каскадування: в якій черговості застосовуються стильові правила. Анотація !important.
  • селектори і розрахунок специфічності.
Практика
  • контрольні тести за темами розділу
Розділ 4. Отримання значень за замовчуванням

Подивимося, що відбувається, якщо не задати значення явно. Розберемося з успадкованими і ненаслідуваними властивостями і значеннями за замовчуванням. Розглянемо спадкування кастомних властивостей і способи повернути каскад назад.

теорія
  • успадковані і ненаслідувані властивості.
  • Значення за замовчуванням.
  • кастомні властивості.
  • примусове успадкування. Ключове слово inherit.
  • відкат каскаду. Ключові слова revert, unset, initial.
  • властивість all.
Практика
  • контрольні тести за темами розділу
Розділ 5. Обчислення

Розберемося, що відбувається з каскадованими значеннями далі, як вони обчислюються в конкретні значення, використовувані для відтворення в браузері.

теорія
  • етапи обчислень: computed, used, actual value.
Практика
  • контрольні тести за темами розділу
Розділ 6. Каскад на практиці

Попрацюємо з каскадом на практиці. У докладних покрокових демонстраціях розберемо реалізацію типових прийомів і компонентів.

теорія
  • властивість font-size-adjust.
  • стилізація компонента спиннер.
  • стилізація кастомних компонентів.
  • " Липкий " підвал сторінки.
  • функції для обчислень в CSS.
підсумкове випробування

Вам потрібно буде виконати завдання-реалізувати алгоритм каскаду на JavaScript, використовуючи всі отримані знання про CSS-каскаді.

Продає сайт:
https://privatelink.de/?https://l.htmlacademy.ru/anatomy-of-cascade?_ga=2.40679842.1236153396.1643136155-933805181.1643136155#rec403190192
 
Угорі