Також як у HTML є теги, в CSS є “селектори”. Під селекторами слід розуміти імена, які описують стилі у внутрішніх і зовнішніх таблицях стилів. У цьому початковому керівництві по CSS ми зосередимося на HTML-селекторах, які представляють собою імена HTML-тегів і застосовуються для того, щоб змінити стиль даного тега.
У кожного селектора є властивості, які знаходяться всередині фігурних дужок. Приклади властивостей: color, font-weight, background-color.
Продовження
<div> і <span> застосовуються разом з каскадними таблицями стилів. Окремо вони не викликають великих змін. Факт у тому, що тег <span> взагалі не впливає візуально на контент. Використання тега <div> призведе до «блокування» його вмісту, якщо б ви поставили тег <br> до і після секції на сторінці.
Як і більшість інших тегів, <div> та <span> може мати клас, ідентифікатор та стильові атрибути. Завдяки цим атрибутам стилі можна застосовувати до елементів. Теги застосовуються таким же способом, як і інші HTML-теги. Допускається вкладеність одних тегів в інші в кілька рівнів.
Продовження
Одні й ті ж властивості можуть бути дані декільком селекторам без необхідності повторювати їх. Для цього селектори треба розділяти комами.
Продовження
Flow ( в перекладі з англ. – потік ) описує, як елементи розташовуються відносно один одного. За замовчуванням родинні елементи перебувають в одному потоці і їх розташування на сторінці статично; порядок появи елементів на сторінці такий же, як і в коді. За допомогою CSS можна переміщати елементи в окремі потоки. Це дає більше можливостей для дизайну сторінки та контролю схеми розміщення елементів над кодом.
Продовження
У багатьох властивостей є успадковані значення. Це значення визначає, що значення властивості має бути успадковано від батьківського елемента. Якщо ми не визначаємо властивість, не виражене явно значення буде успадковано.
Ми можемо використовувати правило @import для імпорту однієї таблиці стилів в іншу. Два синтаксису можуть використовуватися для @import:
Продовження
margin та padding є найбільш популярними властивостями для розстановки елементів. У той час як margin визначає простір за межами ( зовні ) елемента, padding визначає простір всередині елемента.
Продовження
Стилі можуть відноситися до різних типів медіа. Наприклад, можна створити окремий стиль для сторінки, яка буде проглядатися в браузері, та інший стиль для друку сторінки. Ви можете визначати тип медіа в теге <link> для зовнішньої таблиці стилів і всередині тега <style> для впроваджуваних таблиць стилів.
Продовження
