Розробка, підтримка, SEO, просування, соцмережі та реклама сайтів ☣
Кабінет клієнта
Зареєструватись Забули пароль?
Створення та оптимізація сайтів » Блог » faq » Рядкові і блокові елементи css

Рядкові і блокові елементи css

Створюю і просуваю комерційні сайти та інтернет-магазини з 2008 року. 3-05-2013, 02:08 2 795 0
Рядкові і блокові елементи css

Більшість структурних елементів html ділитися на дві основні групи, які дозволяють сформувати документ практично будь-якої складності:

 

- блокові елементи (block)

- рядкові елементи (inline).

У чому полягає основна різниця між цими елементами? Кардинальним відмінністю між ними є те, що рядкові елементи (inline), за визначенням, не мають верхнього і нижнього відступу. Це засновано на тому, що в загальному потоці рядкові елементи (inline) йдуть один за одним, тобто в одному рядку і на іншу переходять тільки коли доходять до кінця рядка, або коли щось примусово змушує перейти на новий рядок. Блокові елементи (block), на відміну від рядкових елементів, в загальному потоці розташовуються один під іншим.

Тобто, рядковим елементам не можна задати margin-top, margin-bottom, padding-top, padding-bottom. Завдяки цій характеристиці є підводні камені, вони полягають у тому, що згідно специфікації HTML 4.0, є ряд елементів, які відносяться до рядкових елементів.

Для наочності нижче приводитися список елементів, які відносяться до рядкових і які до блокових.

РЯДКОВІ ЕЛЕМЕНТИ:

 

<a href="">xxx</a>
<br />
<cite>xxx</cite>
<code>xxx</code>
<em>xxx</em>
<img />
<input />
<label>xxx</label>
<select></select>
<span>xxx</span>
<strong>xxx</strong>
<sub>xxx</sub>
<sup>xxx</sup>
<textarea>xxx</textarea>

 

БЛОКОВІ ЕЛЕМЕНТИ:

 

<div>xxx</div>
<dl>xxx</dl>
<form>xxx</form>
<h1>xxx</h1>
<h2>xxx</h2>
<h3>xxx</h3>
<h4>xxx</h4>
<h5>xxx</h5>
<h6>xxx</h6>
<hr />
<noscript>xxx</noscript>
<ol>xxx</ol>
<p>xxx</p>
<pre>xxx</pre>
<table>xxx</table>
<ul>xxx</ul>

 
 


Коментарі

⤹ Залишити свій коментар ⤸

  • оновити, якщо не видно коду
Останнє на сайті
  • seo

    Нова пачка для індексування сайтів

    coments/129 vievs/ 0
  • Блог

    Український двигунчик CMS для сайту

    coments/388 vievs/ 0
  • Блог

    Що таке сучасний хостинг?

    coments/472 vievs/ 0
Останнє в магазині
Картинка в meta з додаткового поля Картинка в meta з додаткового поля / Платні модулі DLE
Коментарі
Популярне на сайті

Для усіх любителів Анекдотів українською існує чудовий сайт з безліччю приколів, смішних історій та відео: Анекдоти

Тарифні плани

Потужний старт Стандартний запуск сайту від $400
  • - ♜ -
  • В стартовий тарифний план входить:

  • Розробка та налаштування сайту
  • Семантичне ядро
  • Оптимізація швидкості
  • Наповнення до SEO 5 сторінок
  • Ліцензія двигунчика DLE
Просунутий SEO оптимізований сайт від $700
  • - ♚ -
  • В SEO тарифний план входить:

  • Створення та налаштування сайту
  • Семантичне ядро
  • Оптимізація швидкості
  • Наповнення до SEO 10 сторінок
  • Ліцензія двигунчика DLE
  • 5 силок + перелінковка
Імперський винущувач конкурентів від $999
  • - ♛ -
  • В імперський тарифний план входить:

  • Розробка сайту
  • Наповнення до SEO 20 сторінок
  • Повна оптимізація
  • Ліцензія двигунчика DLE
  • МОЄ НАТХНЕННЯ та ДОСВІД!
/* soc-knopki */