Безплатно! Онлайн събитие: От претоварване с информация до фокус и структура с Gemini & NotebookLM Регистрация тук.

От инлайн стилове към CSS

Пълен достъп до курса: Не

За пълен достъп или безплатна проба (2 модула), моля влезте или се регистрирайте.

HTML5 и CSS3 В курса ще се научите как да създавате съвременни уеб страници с помощта на HTML и CSS. Това обучение е подходящо за напълно начинаещи и ще ви помогне да усвоите основите на уеб разработката, като научите как да създавате структура и стил на уеб страници.

Най-важното: отделяме съдържанието от стила

Инлайн стиловете правят HTML кода труден за четене и поддръжка. По-добрият подход е да изнесем всички стилове в CSS, като ги поставим в style тага в head частта на документа. Така HTML остава отговорен за структурата и съдържанието, а CSS – за визията и оформлението.

Стъпка по стъпка: как да преминете от inline стилове към CSS

Отворете HTML файла от предходната задача (иконка, текст и професия).
Добавете style таг в head секцията на документа.
За всеки елемент със style атрибут:
- Използвайте името на тага като селектор (например body, header, img, h1, span).
- Поставете името на селектора и отворете къдрави скоби { }.
- Копирайте CSS свойствата от style атрибута между къдравите скоби.
- Изтрийте style атрибута от съответния HTML елемент.
Запазете файла и презаредете страницата в браузъра – визуалният резултат трябва да остане същият.

Основни понятия от урока

style (HTML таг) – Позволява писане на CSS в head частта на документа.
Селектор по таг (напр. body, h1, span) – Прилага стил към всички елементи от този тип.
{ } – Къдрави скоби, в които се поставят CSS свойствата.
; – Разделя отделните CSS декларации.

Важно: селекторите по таг са общи – ако добавите нов h1 или span, те автоматично ще получат същите стилове.

Дискусия към урока

Въпроси

Отговори

Злат Попзлатев

Защо картинката ми е толкова голяма?