Урок №11: блоки в HTML
Блоки как и таблицы необходимы для успешной верстки сайтов. Блоком называется контейнер, в котором находится какое-либо содержимое в любом количестве. Для примера, на данном сайте вся панель меню заключена в блок, с названием "Главное меню". Блоки определяются парным тегом <div>. Блок может содержать в себе сколько угодно блоков, а также абзацев и других элементов. Многие верстальщики считают, что блочное построение вместе с CSS - идеально подходят для создания сайта. Более детально такую структуру рассмотрим на уроках CSS. Если рассматривать тег <div> исключительно в HTML, то он имеет незначительные параметры: align - выравнивает содержимое блока и title - добавляет всплывающую подсказку блока и другие универсальные параметры. Поэтому вид блока, как правило, управляется с помощью стилей.
Iframe в HTML
В отличие от фреймов, этот элемент задается в контейнере body, он создает окно на странице, в котором будет отображаться другая страница или документ, необязательно вашего сайта. Задается этот элемент с помощью парного тега <iframe>. Данный тег широко применяется для отображения видео, таблиц, изображений и т.д, с других сайтов. Элемент Iframe можно разместить в любое место на странице (особенно с помощью CSS), также данный элемент может не иметь рамки и использоваться без полос прокрутки, можно легко задать ширину и длину такого элемента.
Параметры тега <iframe>
- src – задает url страницы или фрагмента, который будет находится внутри элемента iframe.
- frameborder – устанавливает границу окна iframe (по умолчанию 1, если задать 0, граница исчезнет)
- scrolling – определяет наличие полосы прокрутки (по умолчанию yes, no – полоса прокрутки отсутствует).
- width – задает ширину iframe в пикселах или процентах.
- height – задает высоту iframe в пикселах или процентах.
- align – определяет выравнивание элемента, значения параметра: top, right, bottom, left, middle.
Пример использования Iframe в HTML:
<html> <head> <title>HTML iframe</title> </head> <body> <iframe src="http://www.drawingart.org" width="20%" height="200" frameborder="3"> </iframe> </body> </html>
|
Стоит заметить, что некоторые сайты и поисковые системы не позволяют использовать их в таких рамках, другие не совсем корректно отображаются. Вид в браузере:
Тег <iframe> имеет несколько дополнительных атрибутов, которые применяются реже, однако мы все-равно их рассмотрим.
- allowtransparency - задает прозрачный фон окна фрейма, через который виден фон страницы.
- hspace - задает горизонтальный отступ от окна фрейма до окружающего его содержимого страницы.
- vspace - задает вертикальный отступ от окна фрейма до окружающего его содержимого страницы.
- marginheight - задает отступы снизу и сверху от содержания до границы окна фрейма
- marginwidth - задает отступы справа и слева от содержания до границы окна фрейма
- seamless - создает имитацию, чтоб содержимое фрейма отображалось, словно оно является частью страницы.
- sandbox - создает ограничения на содержимое, загружаемое в окне фрейма
- srcdoc - хранит содержимое фрейма в атрибуте
- name - задает имя окна фрейма
Все атрибуты задаются в теге <iframe> и отвечают за плавающий фрейм, который находится внутри обычной веб-страницы. Далее рассмотрим фоновую музыку и различные плеера в HTML: Музыка в HTML
|