Прескочи към основното съдържание Прескочи към навигацията
Допълнения към урока
Учебна програма HTML5 и CSS3
1. Въведение в HTML и CSS

Блокови и инлайн елементи

-51,13 € за ВЕЛИКДЕН: Вземи курс "HTML5 и CSS3" за    127,31 € 76,18 €  ВИЖ ТУК

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

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


Най-важното за блоковите и inline елементите

Блоковите елементи разделят съдържанието на отделни логически части и започват на нов ред. Inline елементите остават в рамките на текущия ред и не прекъсват потока на текста. Най-важната разлика е, че div създава отделен блок, а span маркира част от текста, без да променя подредбата му. Използвайте блокови елементи за структура, а inline – за фино разграничаване вътре в текста.

Как да тествате разликата сами

  1. Създайте прост HTML файл с текст на два реда (например име и професия).
  2. Оградете първия ред с div и запазете файла – ще видите, че съдържанието се показва на отделен ред.
  3. Премахнете div и вместо това използвайте span около част от текста.
  4. Презаредете страницата – текстът ще остане на същия ред, без визуална промяна.
  5. Сравнете поведението на двата елемента и обърнете внимание как браузърът ги интерпретира.

Използвани HTML елементи

  • div – блоков елемент, който групира съдържание в отделна логическа секция и започва на нов ред.
  • span – inline елемент, който маркира част от текст без да нарушава подредбата.
  • br – добавя нов ред, но не създава логическа структура (използва се по-рядко за оформление).

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