Блоки HTML

Все элементы HTML можно классифицировать в 2 элемента элементов уровня блока категорий (a) (b) встроенных

Элементы блока

Элементы блока кажутся на экран если они имеют линию пролом перед и после ими. Например <p>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <ul>, <ol>, <dl>, <pre>, <hr/>, <blockquote>, и элементы <address> все элементы уровня блока. Они все начинают на их собственной новой линии, и что-нибыдь которое следовать ими появляется на свою собственную новую линию.

Встроенные элементы

Встроенные элементы, с другой стороны, могут появиться в пределах предложений и не должны появиться на новую линию их. <b>, <i>, <u>, <em>, <strong>, <sup>, <sub>, <big>, <small>, <li>, <ins>, <del>, <code>, <cite>, <dfn>, <kbd>, и элементы все <var> встроенные элементы.

Собирать элементы HTML

2 важных бирки которой мы используем очень часто для того чтобы собрать различно другую бирку <div> бирок HTML (I) и (ii) бирку <span>

Бирка <div>

Это очень важная бирка уровня блока которая играет большую роль в собирать различный другие бирки HTML и прикладывать CSS на группе в составе элементы. Уже сейчас бирку <div> можно использовать для того чтобы создать план webpage где мы определяем различные части (вышл, выпрямите, покройте etc) страницы используя бирку <div>. Эта бирка не обеспечивает никакое визуально изменение на блоке но это имеет больше смысли когда оно использовано с CSS.

Пример

Следование простой пример бирки <div>. Мы выучим лист каскадируя типа (CSS) в отдельно главе но мы использовали ее здесь для того чтобы показать использование бирки <div>:

<!DOCTYPE html>
<html>
<head>
<title>HTML div Tag</title>
</head>
<body>

<!-- First group of tags -->
<div style="color:red">
   <h4>This is first group</h4>
   <p>Following is a list of vegetables</p>
   <ul>
   <li>Beetroot</li>
   <li>Ginger</li>
   <li>Potato</li>
   <li>Radish</li>
   </ul>
</div>

<!-- Second group of tags -->
<div style="color:green">
   <h4>This is second group</h4>
   <p>Following is a list of fruits</p>
   <ul>
   <li>Apple</li>
   <li>Banana</li>
   <li>Mango</li>
   <li>Strawberry</li>
   </ul>
</div>

</body>
</html>

Это даст следующий:

This is first group

Following is a list of vegetables

  • Beetroot
  • Ginger
  • Potato
  • Radish

This is second group

Following is a list of fruits

  • Apple
  • Banana
  • Mango
  • Strawberry

Бирка <span>

<span> HTML встроенный элемент и его можно использовать для того чтобы собрать встроенн-элементы в документе HTML. Эта бирка также не обеспечивает никакое визуально изменение на блоке а имеет больше смысли когда она использована с CSS.

Разница между биркой <span> и биркой <div> что бирка <span> использована с встроенными элементами где как <div> бирка использована с элементами блок-уровня.

Пример

Следование простой пример бирки <span>. Мы выучим лист каскадируя типа (CSS) в отдельно главе но мы использовали ее здесь для того чтобы показать использование бирки <span>:

<!DOCTYPE html>
<html>
<head>
<title>HTML span Tag</title>
</head>
<body>

<p>This is <span style="color:red">red</span> and this is <span style="color:green">green</span></p>

</body>
</html>

Это даст следующий:

Это красно, и это зелено

Advertisements