Скидання CSS (скидання стилів) - це обнулення за допомогою CSS, деяких параметрів HTML-елементів, які браузери встановлюють за замовчуванням. Наприклад, до таких елементів можна віднести параграфи (тег
), У яких спочатку присутні ненульові вертикальні поля (CSS margin), марковані списки (тег
- ), Які мають вже не тільки поля, а й маркери певного типу (CSS list-style-type) і так далі.
- Як зробити сайт
Самому безкоштовно - Підручник HTML
Для початківців - Підручник CSS
Для новаків - Довідники
За HTML і CSS - приклади
HTML і CSS - посилання
Корисні сайти для веб-майстрів - інструментарій
Програми для створення сайтів
Тепер давайте подумаємо, для чого потрібен цей скидання CSS, що він може нам дати? Добре, уявіть, що ви верстали сторінки свого сайту і при цьому не змінили поля параграфів, які браузери запропонували за замовчуванням, так як їх розмір вас цілком влаштував. Але скажіть мені, будь ласка, а з чого ви вирішили, що всі браузери світу, які вже існують і ще з'являться, будуть створювати поля такого ж розміру? Більш того, чому ви думаєте, що ті браузери, в яких ви тестували свою верстку, не змінять в своїх наступних версіях розмір цих полів або взагалі їх не приберуть? Відчуваєте, чим пахне?
Так ось, скидаючи CSS, верстальники просто підстраховуються від подібних непорозумінь, тобто вони спочатку обнуляют у елементів все «критичні» значення властивостей CSS, а потім у міру необхідності додають назад, але вже зі своїми розмірами. Таким чином, можна бути впевненим, що у всіх браузерах сайт буде виглядати однаково. Можна звичайно і не скидати стилі, а просто по ходу верстки задавати потрібні параметри елементів, але тут є ризик, що десь щось буде упущено і в певний момент все «попливе».
Виходячи з вищесказаного, однією з особливостей скидання CSS є те, що після його застосування багато HTML-елементи втрачають свій звичний зовнішній вигляд. І якщо втрата полів у параграфів є для новачків чимось очікуваним, то наприклад той факт, що кнопки створені за допомогою тегів
Способів скидання стилів існує дуже багато, і який оберете ви - залежить тільки від вас, але можу вам сказати одне - кращий скидання це той, який ви створили самі, грунтуючись на своєму досвіді і звичках. Якщо ж такого досвіду у вас поки немає, то можете скористатися одним з варіантів запропонованих нижче.
Завжди вказуйте стилі для скидання CSS в самому початку коду, то наші люди із параметрів можуть не спрацювати через пріоритетів стилів. які встановлюються браузерами при обробці HTML-сторінки і коду CSS.
Скидання CSS за допомогою універсального селектора
опис прикладу
У цьому прикладі за допомогою універсального селектора зазначені стилі скидаються відразу у всіх HTML-елементів, які будуть присутні на сторінці. Як бачите, більшість властивостей вказано саме для підстраховки, так як їх значення і так відповідають тим, які браузери повинні підставляти за замовчуванням згідно специфікації CSS. Але як ви вже знаєте, на практиці все це абсолютно не так і якщо властивість font-family дійсно успадковується елементами від своїх батьків у всіх провідних браузерах, то ті ж зовнішні поля, задані властивістю CSS margin зовсім не завжди спочатку дорівнюють нулю.
А ось розміри рамок (CSS border) і контурів (CSS outline) за замовчуванням не дорівнюють нулю, але вже згідно специфікації. Однак і їх товщина була обнулена, щоб верстальник не забув вказати її явно там, де це буде потрібно.
Скидання CSS від Yahoo!
опис прикладу
Компанія Яху свого часу розробила свій варіант скидання стилів. Тут вже змінюються властивості конкретних елементів, що дозволяє досягти більшої гнучкості в управлінні їх зовнішнім виглядом. Наприклад, тут зібрано маркери у списків, а у тега - лапки за допомогою властивості CSS content. Плюси такого підходу очевидні, а ось до мінусів можна віднести більш об'ємний і часом надлишковий код. Але ж ніхто не заважає вам змінити будь-яке скидання CSS під свої потреби. Припустимо, ви можете видалити деякі непотрібні вам селектори тегів не просто прибрати лапки, а відразу задати їм необхідний зовнішній вигляд.
Скидання CSS від Еріка Мейєра
опис прикладу
Черговий спосіб скидання CSS запропонував Ерік Мейер (Eric Meyer) - відомий в певних колах веб-розробник. Тут він уже додав скидання стилів для тегів з HTML 5, які, до речі, на момент написання цієї статті і самі-то ще дуже погано підтримувалися сучасними браузерами. Але ж завжди потрібно дивитися в перспективу, вірно?
Насправді цю статтю можна було б продовжувати до нескінченності, так як, повторюю в черговий раз, в певний момент кожен верстальник приходить до свого варіанту скидання або не використовує його взагалі, покладаючись на свою уважність.