RUS | ANG | |

StepkinBlog.ru

Пока я творю, я живу!
Блог посвящен: HTML, CSS, PHP, Wordpress, Bootstrap

Главная » Основы HTML » Тег div в HTML. Основы HTML для начинающих. Урок №17

21.12.2015


15:12


20883


1


Тег в HTML. Основы HTML для начинающих. Урок №17

Тег div в HTML. Основы HTML для начинающих. Урок №17

Всем привет!
Продолжаем изучать основы HTML.
В этом уроке я расскажу коротко о теге <div> для чего он нужен, как им пользоваться.
Урок будет очень коротким, но очень важным и полезным. Если вы в дальнейшем будете создавать сайты, макеты, шаблоны, то вам придется очень часто видеть тег <div>.

Когда-то, до царя Гороха,

Тег <div> в HTML. Основы HTML для начинающих. Урок №17

для создания каркаса сайта использовали таблицы HTML:

Тег <div> в HTML. Основы HTML для начинающих. Урок №17

Теперь все изменилось! Вместо тега <table> для создания каркаса сайта стали использовать тег <div>.

тег <div>

тег  <div> - это блочный элемент, внутри которого могут находиться другие теги, содержание веб страницы. Своего рода, это контейнер, который можно легко видоизменять и выводить в любом месте веб страницы с помощью CSS. Без использования CSS тег <div> мало функционален. Но вы не заморачивайтесь и не кидайтесь сразу изучать основы CSS. Познакомьтесь с тегом <div>, пройдите полностью основы HTML и только тогда переходите к изучению CSS, иначе запутаетесь.

Итак, тег <div>, закрывающий тег обязателен.

<div>содержимое</div>

* атрибуты тега <div>

Чтобы выравнивать блок <div> с помощью CSS, используют атрибут align:

align

  • Center - выравнивание блока по центру. Пример: align="center".
  • Left - выравнивание блока по левому краю (по умолчанию). Пример: align="left".
  • Right - выравнивание блока по правому краю. Пример: align="right".

Пример:

<div align="left">блок будет размещен в левой части html страницы</div>
<div align="right">блок будет размещен в правой части html страницы</div>
<div align="center">блок будет размещен по центру html страницы</div>

class

class - имя класса для связки с CSS оформлением. Пример: class="имя".

Пример:

<div class="header"><img src="http://stepkinblog.ru/wp-content/themes/stepkinblog/images/heder.png"></div>

id

id - имя CSS идентификатора. Пример: id="#имя".

Пример:

<div id="#header"><img src="http://stepkinblog.ru/wp-content/themes/stepkinblog/images/heder.png"></div>

title

title – описание блока в виде всплывающей подсказки. Пример: title="описание".

Пример:

<div title="А вот и я!">Пример всплывающей подсказки</div>

[посмотреть все примеры]

Как я и говорил, урок короткий, но, поверьте, очень важный. Удачи, жду вас на следующих своих уроках! Не пропустите.



Случайные записи:

  1. Работа с массивами. Основы PHP с нуля. Урок №13
  2. Нам 3 годика! С Днем Рождения StepkinBlog.ru!!!
  3. Как проверить HTML форму. Основы HTML для начинающих. Урок №19
  4. Мой отдых на Арабатской стрелке
  5. Cкелет HTML. Основы HTML для начинающих. Урок №1

Последние записи рубрики:

  1. Приложение для смартфонов (андроид) – основы HTML
  2. Бесплатный курс по основам HTML
  3. Шпаргалка по HTML на русском языке
  4. Создание простого мини сайта. Практика по пройдённому материалу
  5. Тесты HTML онлайн. Основы HTML для начинающих

Один ответ на статью: “Тег div в HTML. Основы HTML для начинающих. Урок №17”

  1. Галина says:

    Спасибо за интересную информацию

    Ответить

Добавить комментарий

;-) :| :x :twisted: :smokes: :smile: :shock: :sad: :rose: :roll: :razz: :pop-corne: :oops: :o :mrgreen: :lol: :idea: :grin: :gazeta: :evil: :cry: :cool: :coffe: :arrow: :???: :?: :!:

Подписаться на обновления:

Подпишись на обновления моего блога через e-m@il:

@

Реклама на блоге:

Мои цели на
2019 год:

Довести количество статей до 150

Доделать этот блог

Закончить тему «Основы CSS»

Закончить тему «Основы PHP»

Начать тему «Основы JavaScript»

Добиться посещаемости 500 чел/сутки

Статистика:

Записей: 111
Страниц: 3
Рубрик: 9
Меток: 11
Комментариев: 347