У цьому скрінкасті ми будемо працювати над областю «Демонстрації» CSS-хитрощів. Це досить популярна область сайту, незважаючи на те, що я не витрачаю на нього стільки часу, скільки мав би. Суть цього - це місце на сайті, де можна завантажити та переглянути демонстраційні демонстраційні файли в одному місці, тому дуже легко прокручувати та переглядати, а також знаходити біти, які можуть зацікавити вас та ваші проекти.
За структурою це дуже схоже на область відео. Кожна демонстрація має назву та короткий опис та кілька кнопок, як і кожне відео. Тож ми змоделюємо макет так само, як і область відео. Однак, на відміну від області відео, ми не можемо видалити створений вручну HTML і замінити його на цикл WordPress. Це тому, що кожна демонстрація не живе всередині WordPress, вони незалежні. Це нормально, хоча ми не боїмося невеликої розмітки. Ми просто перепишемо його трохи, щоб зробити його максимально досконалим.
Тепер у нас є всі біти на місці, як нам потрібно. Ми контролюємо розмітку. Ми контролюємо CSS лише для цієї конкретної області. Виконано лише декілька майданчиків із цим, і основна область вмісту для цієї області.
Наприкінці ми розглядаємо окремі демонстраційні сторінки та бачимо, як брендування CSS-Tricks також стосується цих сторінок.