CSS – Каскадні списки стилів
Каскадні списки стилів (CSS) — це мова стилів, що використовується для задання вигляду документів, написаних мовою HTML або XML (включно із діалектами XML, як-от SVG, MathML чи XHTML). CSS описує, який вигляд елементи матимуть на екрані, папері, у мовленні чи в іншому вигляді.
CSS належить до ключових мов відкритого вебу і стандартизована між вебпереглядачами згідно зі специфікаціями W3C. У минулому розробка різних частин специфікації CSS велася послідовно, що давало змогу випускати свіжі рекомендації у форматі редакцій. Ви могли чути про CSS1, CSS 2.1 чи навіть CSS3. Ніколи не буде жодних CSS3 чи CSS4; натомість тепер усе є "просто" CSS, а номери версій є в окремих модулів CSS.
Після виходу CSS2.1 обсяг специфікації помітно зростав. Прогрес різних модулів CSS почав настільки сильно відрізнятись, що стало більш ефективним розробляти та випускати рекомендації для кожного модуля окремо. Замість оформлення редакцій специфікації CSS, W3C тепер періодично робить знімок найсвіжішого стабільного стану специфікації CSS і поступу окремих модулів. Модулі CSS тепер мають номери версій, або рівні, як то Модуль кольору CSS рівня 5.
Ключові матеріали
- Вступ до CSS
Якщо ви новачок у веброзробці, обов'язково прочитайте нашу статтю про основи CSS, з якої можна дізнатися, що таке CSS та як їх використовувати.
- Підручники з CSS
Наша зона вивчення CSS містить силу-силенну підручників, щоб допомогти на шляху від початкового до високого рівня майстерності, покриваючи усі засадничі принципи.
- Довідник CSS
Наш довідник CSS описує кожну властивість та концепцію CSS.
Підручники
Наша Зона вивчення CSS містить низку модулів, що навчають CSS з нуля, – попередні знання не потрібні.
- Перші кроки у CSS
CSS (каскадні списки стилів) використовуються для стилізації та створення вебсторінок – наприклад, для зміни шрифту, кольору, розміру, інтервалів вашого контенту, поділу його на кілька стовпчиків, або додавання анімацій та інших декоративних особливостей. Цей модуль дасть м'який початок вашому шляху до майстерності в CSS у вигляді основ того, як вони працюють, який вигляд має синтаксис, і як можна почати використовувати їх для стилізації HTML.
- Цеглинки CSS
Цей модуль продовжує там, де Перші кроки у CSS зупинились, — тепер, ознайомившись із мовою та її синтаксисом, і отримавши деякий базовий досвід її використання, пора дещо заглибитись. Цей описує каскадність та наслідування, всі доступні типи селекторів, одиниці вимірювання, розміри, стилізацію тла та меж і багато іншого.
Його метою є надання набору інструментів для написання грамотного CSS та допомога у розумінні всієї необхідної теорії перед переходом до більш специфічних дисциплін, як-от стилізація тексту та компонування CSS.
- Стилізація тексту засобами CSS
Після ознайомлення з основами мови CSS, наступною темою є стилізація тексту – одна з найбільш поширених справ, котрі доводиться робити на CSS. Тут ми розглянемо основи стилізації тексту, включно з установленням шрифту, жирності, нахилу, відступу між рядками та між літерами, тіней та інших особливостей тексту. Закінчується модуль оглядом застосування власних шрифтів для вашої сторінки та стилізації списків і посилань.
- Компонування CSS
На цьому етапі освоєння засади CSS уже пройдені, ви вже знаєте, як стилізувати текст, і як стилізувати й маніпулювати рамками, в котрих вміщається контент. Тепер пора поглянути на те, як розташувати ці блоки на сторінці й відносно одне одного. Необхідні умови виконано, можемо заглиблюватись у компонування CSS, поглянути на різні налаштування екранів, сучасні інструменти компонування, як-от флексбокс, сітку CSS та позиціювання, а також на деякі застарілі техніки, про які вам все ж слід знати.
- Використовуйте CSS для подолання поширених проблем
Цей модуль містить посилання на розділи з поясненнями як користуватися CSS для подолання поширених проблем під час створення вебсторінок.
Довідка
Довідка CSS – це вичерпна довідка для загартованих веброзробників описує кожну властивість і кожну концепцію CSS, серед яких:
- Синтаксис та форми мови
- Специфічність, успадкування та каскадність
- Селектори CSS, включно з псевдоелементами, вкладеністю, контекстністю і тіньовими частинами
- Директиви CSS, у тому числі медійні та контейнерні запити
- Одиниці вимірювання та значення CSS і функційні записи
- Рамкова модель і перекриття зовнішніх полів
- Контейнерний блок
- Нагромаджувальні та блоково-форматувальні контексти
- Початкові, обчислені, вжиті та фактичні значення
- Властивості-скорочення CSS
- Гнучка рамка CSS, багатоколонкове та сіткове компонування
- Анімація, переходи та перетворення
Книга рецептів
Книга рецептів CSS прагне зібрати докупи рецепти загальноприйнятих шаблонів компонування та іншого, що може знадобитись під час розробки ваших вебсайтів. Окрім надання коду, котрий можна використовувати як стартову точку власних проєктів, ці рецепти показують різні способи застосування специфікацій компонування, і рішень, котрі можуть бути прийняті розробником.
Інструменти CSS-розробки
- Для перевірки валідності CSS можна застосовувати Службу перевірки CSS від W3C. Це незамінний інструмент зневадження.
- Інструменти розробника Firefox дають змогу переглядати CSS сторінки на льоту за допомогою Інспектора та Редактора стилів.
- Розширення веброзробника для Firefox дає змогу відстежувати та редагувати CSS відображених вебсайтів на льоту.
Метаінформація про вади
- Firefox: Вада Firefox 1323667