Html атрибут style

Атрибут style

Атрибут style використовується для стилізації елементів безпосередньо в HTML коді. Мета атрибута style полягає в наданні простого способу зміни зовнішнього вигляду практично будь-якого HTML елемента.

Код прикладу познайомить вас з новим способом форматування документа:

Уважно подивіться на приклад, за допомогою атрибута style ми задаємо CSS стиль всередині HTML-елементів, такий спосіб завдання стилів називається вбудованим стилем. Вбудований стиль застосовується тільки до елементу, в якому він був визначений, і до його дочірнім елементам (якщо застосовані CSS властивості успадковуються).

Примітка: подивитися успадковується значення застосованого властивості дочірніми елементами чи ні, можна в CSS довіднику на сторінці з даними властивістю.

Задній фон

Задній фон елемента задається за допомогою властивості background-color. яке в якості значення може приймати будь-яке доступне значення кольору (про різні значення кольорів дивіться нижче), після властивості обов'язково має йти двокрапка і значення, після значення обов'язково ставиться крапка з комою, ці правила поширюються на всі властивості атрибута style. Якщо потрібно задати кілька властивостей стилю для одного елемента, то кожне наступне властивість записується після ";" попереднього властивості.

колір тексту

Колір тексту елемента задається за допомогою властивості color. Завдяки цій властивості можна задати будь-який колір для текстового вмісту. Як значення властивість color може приймати назви кольорів, завдання кольору за допомогою процентного співвідношення червоного, зеленого і синього або використовувати шістнадцяткові коди.

Визначення кольору за назвою

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

Отже, щоб задати колір таким чином, потрібно просто вказати його назву в якості значення властивості. При цьому не має значення, пишіть ви назви малими або великими літерами, тому можна написати silver, Silver або SILVER, і все це буде працювати.

Визначення кольору через значення, що задається поєднанням червоного, зеленого і синього

Можна визначити колір, вказавши поєднання червоного, зеленого і синього в певній пропорції. Припустимо, вам потрібно задати помаранчевий колір, який складається з 80% червоного, 40% зеленого і 0% синього. Ось як це можна зробити:

Можна також задавати значення червоного, зеленого і синього числами від 0 до 255. Наприклад, замість 80% червоного, 40% зеленого і 0% синього можна писати 204 червоного, 102 зеленого і 0 синього.

Подивіться, як для завдання кольорів використовуються звичайні числові значення:

Визначення кольору через шістнадцятковий код

Тепер перейдемо до шістнадцятковим кодами. Відкриємо вам невеличкий секрет: кожен набір двох чисел такого коду представляє червону, зелену і синю складову кольору. Так, перші дві цифри представляють червоний колір, наступні дві - зелений і останні дві-синій:

Примітка: всі три методи визначення кольорів в CSS підходять до всіх властивостей, які в якості значень можуть приймати кольору. Всі доступні назви кольорів ви можете подивитися в нашій таблиці кольорів. там же ви зможете підібрати колір в значенні rgb або шістнадцятковому, якщо вам не підійде жоден з відтінків представлених в таблиці.

Шрифти можуть дуже сильно впливати на дизайн сторінок. В CSS вони розділені на сімейства, в яких ви можете вибрати, який шрифт краще підходить для певного елемента на сторінці.

Властивість font-family дає можливість задати список бажаних шрифтів, які вказуються через кому. Якщо ім'я шрифту складається з декількох слів, то таку назву слід укласти в подвійні лапки, наприклад: "Courier New".

Розмір шрифту дуже сильно впливає на дизайн веб-сторінки і Новомосковскбельность її тексту. В CSS є кілька одиниць виміру, за допомогою яких можна задавати розмір для тексту, всі вони детально описані в розділі Одиниці виміру CSS. Також є можливість задавати розмір за допомогою ключових слів:

Всі доступні ключові слова, які визначають розмір, ви можете подивитися в нашому довіднику по CSS в описі властивості font-size.

вирівнювання тексту

Вирівнювання тексту в HTML документі задається за допомогою властивості text-align. яке дозволяє вирівняти текст по правій або лівій строне, а так само задати вирівнювання тексту по ширині. Властивість text-align працює тільки з блочними елементами, вирівнюючи усі малі елементи всередині блокового: