Скачать музыку с LiveInternet.ruПростая скачивалка песен по заданным урлам
Я - фотографПлагин для публикации фотографий в дневнике пользователя. Минимальные системные требования: Internet Explorer 6, Fire Fox 1.5, Opera 9.5, Safari 3.1.1 со включенным JavaScript. Возможно это будет рабо
Всегда под рукойаналогов нет ^_^
Позволяет вставить в профиль панель с произвольным Html-кодом. Можно разместить там банеры, счетчики и прочее
ОткрыткиПерерожденный каталог открыток на все случаи жизни(и еще 33 записям на сайте сопоставлена такая метка)
Другие метки пользователя ↓
анимации бисироплетение все для днева вторые блюда вязание генератор готовим в горшочках готовим в духовке декупаж делаем сами десерты диеты для днева домашний уют закуски здоровье и красота игрушки идеи идеи.мк йога красивое тело красивости кройка кукла своими руками кулинария лепка мастер-классы мк новая жизнь старых вещей перешиваем пластиковые бутылки плетем красивые косы полезное полезности полезные программы прически разное разное полезное рецепты свечи своими руками сделай сам сумки супы учебник по html для чайников учебник по html для чайников. холодный фарфор шарнирная кукла шитье шитье идеи шитье идеи дизайн интерьер
Ступенька 41-ая. |
Дневник |
Ступенька 41-ая.
Вот мы добрались и до последней главы о фреймах. Собственно, о фреймах мы закончили говорить в предыдущей главе, а на этой ступеньке мы поговорим об IFrame - "плавающем" фрейме.
Итак, что такое Iframe, и чем он отличается от просто фреймов. IFrame - "плавающий" или встроенный фрейм. Вы, наверняка встречали его уже много раз на разных сайтах. Для Iframe нам не нужно создавать фрейм-документ, и прописывать в нем фреймовую структуру нашей страницы. Iframe позволяет нам вставить один html-документ в другой html-документ.
Как это выглядит:
Как вы видите, появляется форма заданного размера, в которой отображается нужный нам документ. Это очень удобно, вы уже наверняка встречались с "плавающим" фреймом, когда регистрировались на каких-либо сайтах, как правило соглашения с пользователем заключены для удобства в "плавающий фрейм", чтобы вы могли ознакомиться с соглашением, не переходя на другую страницу сайта, сразу.
«Плавающий» фрейм вводится в наш обычный html-документ при помощи тэга <iframe></iframe>:
<IFRAME src="ancorpri.html" width="300" height="250" scrolling="auto" frameborder="1"></IFRAME>
В атрибуте src мы указываем путь к документу, который отобразиться во встроенном фрейме.
Атрибуты height и width отвечают за ширину и высоту встроенного фрейма.
Атрибут scrolling (полоса прокрутки) и его значения мы тоже уже знаем из уроков по фреймам: он может принимать несколько значений: no - это значит совсем не будет полосы прокрутки, ни при каких обстоятельствах; yes - это значит полоса прокрутки будет всегда; auto - полоса прокрутки появится только тогда, когда она нужна.
Атрибут frameborder указывает отображать или нет границы встроенного фрейма, возможные значения 1 (да, отображать) и 0 (нет, не отображать).
Границы встроенного фрейма растягивать при помощи мыши ваш посетитель не может, поэтому атрибута noresize встроенные фреймы не имеют.
Iframe может выравниваться относительно содержимого страницы: текста и картинок, и может, соответственно, быть заключен в тэги выравнивания и таблицы.
Какие подводные камни нас могут ожидать при использовании Iframe – он не поддерживается многими броузерами, в основном старыми версиями броузеров, поэтому стоит подумать прежде, чем включать этот элемент на страницы вашего сайта, так ли это уж необходимо.
На этом наш разговор о фреймах завершен, напоминаю о полезных ссылках в правой колонке, советую изучить, а после переходить к следующей ступеньке, на которой мы начнем новую тему поговорим об объектах и дополнительных средствах, которые облегчают нашу жизнь, делают html-документы динамичными, расширяют наши возможности при создании страниц.
Метки: Учебник по Html для чайников. |
Ступенька 40-ая. |
Дневник |
Ступенька 40-ая.
В этой главе мы поговорим о том, что становиться проблемой для каждого человека, начинающего осваивать фреймы.
Итак, обратимся к нашему примеру. Нажмите на любую из ссылок. Документ, на который введет ссылка, откроется в том же фрейме, в котором располагается документ с меню. А нам нужно, чтобы он открылся во фрейме с основным содержанием, а меню осталось в нетронутом виде. Как это сделать?
Для начала, господа, познакомьтесь с новым атрибутом тэга <frame> - name (кстати, name, мне кажется, что мы с вами уже знакомы:). Пустим name в дело:
|
<html>
<head> <title>Хождение по фреймам</title> </head> <frameset cols="100,*" border="0"> <frameset rows="100,*"> <frame src="logo.html" scrolling="no" marginwidth="0" marginheight="0"> <frame src="menu.html"> </frameset> <frame src="content.html" name="window-1"> </frameset> </html> |
|
<html>
<head> <title>Документ с Меню</title> </head> <body background="cherti3.gif" text="#ffffff" link="#ffffff" alink="#ffffff" vlink="#ffffff"> <center> <a href="content.html">Главная</a> <a href="tumki.html">Тумки</a> <a href="bumki.html">Бумки</a> <a href="tururumki.html">Турурумки</a> <a href="tra-la-la.html">Траляля</a> </center> </body> </html> |
|
<html>
<head> <title>Документ с Меню</title> </head> <body background="cherti3.gif" text="#ffffff" link="#ffffff" alink="#ffffff" vlink="#ffffff"> <center> <a href="content.html" target="window-1">Главная</a> <a href="tumki.html" target="window-1">Тумки</a> <a href="bumki.html" target="window-1">Бумки</a> <a href="tururumki.html" target="window-1">Турурумки</a> <a href="tra-la-la.html" target="window-1">Траляля</a> </center> </body> </html> (посмотреть) |
Метки: Учебник по Html для чайников. |
Ступенька 39-ая. |
Дневник |
Ступенька 39-ая.
Допустим, мы решили остановиться на последнем варианте фреймовой структуры для нашей страницы, значит будем приводить его в более-менее нормальный вид. Для начала избавимся от полосы прокрутки (скрулинга) во фрейме, содержащим документ logo.html.
|
<html>
<head> <title>Хождение по фреймам</title> </head> <frameset cols="100,*"> <frameset rows="100,*"> <frame src="logo.html" scrolling="no"> <frame src="menu.html"> </frameset> <frame src="content.html"> </frameset> </html> (посмотреть) |
|
<html>
<head> <title>Хождение по фреймам</title> </head> <frameset cols="100,*"> <frameset rows="100,*"> <frame src="logo.html" scrolling="no" noresize> <frame src="menu.html" noresize> </frameset> <frame src="content.html" noresize> </frameset> </html> (посмотреть) |
|
<html>
<head> <title>Хождение по фреймам</title> </head> <frameset cols="100,*" border="0"> <frameset rows="100,*"> <frame src="logo.html" scrolling="no"> <frame src="menu.html"> </frameset> <frame src="content.html"> </frameset> </html> (посмотреть) |
|
<html>
<head> <title>Хождение по фреймам</title> </head> <frameset cols="100,*" border="0"> <frameset rows="100,*"> <frame src="logo.html" scrolling="no" marginwidth="0" marginheight="0"> <frame src="menu.html"> </frameset> <frame src="content.html"> </frameset> </html> (посмотреть) |
Метки: Учебник по Html для чайников. |
Ступенька 38-ая. |
Дневник |
Ступенька 38-ая.
В этой главе мы разберемся, как расположить документы в окне следующим образом
или 
В предыдущей главе я говорила, что не можем использовать атрибуты rows и cols одновременно применительно к одному тэгу <frameset>. Тогда как же расположить наши документы в окне так, как указано на рисунках? Просто, ввести в наш фрейм документ еще одного господина <frameset>, но обо всем по порядку.
Начнем с первого рисунка:
Каким образом мы будем делить окно? - На ряды. В первом ряду у нас будет располагаться logo.html, а второй ряд мы поделим на два столбца, в которых будут располагаться документы menu.html и content.html.
|
<html>
<head> <title>Хождение по фреймам</title> </head> <frameset rows="100,*"> <frame src="logo.html"> <???> </frameset> </html> |
|
<html>
<head> <title>Хождение по фреймам</title> </head> <frameset rows="100,*"> <frame src="logo.html"> <frameset cols="150,*"> <frame src="menu.html"> <frame src="content.html"> </frameset> </frameset> </html> (посмотреть) |
|
<html>
<head> <title>Хождение по фреймам</title> </head> <frameset cols="100,*"> <frameset rows="100,*"> <frame src="logo.html"> <frame src="menu.html"> </frameset> <frame src="content.html"> </frameset> </html> (посмотреть) |
Метки: Учебник по Html для чайников. |
Ступенька 37-ая. |
Дневник |
Ступенька 37-ая.
Эту главу мы начнем с небольшого фокуса: замените атрибут rows, на cols:
|
<html>
<head> <title>Хождение по фреймам</title> </head> <frameset cols="100,150,*"> <frame src="logo.html"> <frame src="menu.html"> <frame src="content.html"> </frameset> </html> (посмотреть) |
Метки: Учебник по Html для чайников. |
Ступенька 36-ая. |
Дневник |
Ступенька 36-ая.
Прежде, чем что-нибудь предпринимать дальше, надо решить по какому принципу мы будем размещать наши документы, и вообще, какие документы мы будем показывать посетителю одновременно. Предлагаю классический вариант - logo.html, menu.html, content.html - о котором я упоминала в предыдущей главе.
Расположить мы можем это по-разному, вот для примера четыре варианта из множества возможных:
При помощи фреймов мы делим броузер на несколько окон, заданного размера, в которых помещаем независимые друг от друга документы. Это нам позволит оставлять некоторую информацию видимой, в то время как другая информация прокручивается или заменяется (так, например, мы будем постоянно видеть в одном окне документ с меню, в другом – документ с нашим логотипом, а в третьем окне у нас будут при нажатии на ссылки в документе меню загружаться разные документы с текстом, картинками и прочим).
Т.к. документы, которые мы размещаем во фреймах независимые, то соответственно каждый документ может содержать в себе что угодно (и текст, и картинки, и таблицы). Почему я особо оговариваю этот момент: некоторые неразумные читатели почему-то воображают, что фреймы – это альтернатива таблицам. ЭТО НЕ ВЕРНО!
Итак, сначала создадим такой вариант (предварительно не забудьте создать обычные *.html документы с логотипом, меню и основным содержанием):
|
<html>
<head> <title>Хождение по фреймам</title> </head> <frameset rows="100,*,150"> <frame src="logo.html"> <frame src="content.html"> <frame src="menu.html"> </frameset> </html> (посмотреть) |
|
<html>
<head> <title>Хождение по фреймам</title> </head> <frameset rows="100,*,150"> <frame src="logo.html"> <frame src="menu.html"> <frame src="content.html"> </frameset> </html> (посмотреть) |
|
<html>
<head> <title>Хождение по фреймам</title> </head> <frameset rows="100,150,*"> <frame src="logo.html"> <frame src="menu.html"> <frame src="content.html"> </frameset> </html> (посмотреть) |
Метки: Учебник по Html для чайников. |
Ступенька 34-ая. |
Дневник |
Ступенька 34-ая.
Эту главу мы с вами посвятим специфическом тэгу, речь пойдет о тэге Marquee - бегущей строке (текста).
Тэг Marquee поддерживается только Internet Explorer, но многих людей, начинающих осваивать сайтостроение, это не останавливает, и они с удовольствием его употребляют. Т.к. это болезнь массовая, то мне придется рассказать подробно о тэге Marquee (те, у кого броузер не IE, не будут в этой главе оставлены за бортом, для них я бросила спасательный круг в конце главы).
|
<marquee height="10" width="270" bgcolor="#99CCFF">
</marquee> |
|
<marquee height="10" width="270" loop="2">
</marquee> |
Метки: Учебник по Html для чайников. |
Ступенька 31-ая. |
Дневник |
Ступенька 31-ая.
Наверное, пройдясь по ступенькам, вы уже поняли, что некоторые тэги и некоторые атрибуты тэгов поддерживаются не всеми броузерами. Не будем искать причин почему (да, и откуда мне лично знать, что толкает производителей броузеров придумывать свои специфические тэги и атрибуты, о которых в спецификации (официальной документации по HTML) нет ни слова, а также мне неведомо, почему броузеры не поддерживают некоторые тэги и атрибуты, которые по идее должны поддерживать, т.к. в той же спецификации эти тэги и атрибуты упомянуты), лучше поговорим о некоторых специфических атрибутах для тега BODY, которые вам когда-нибудь, да пригодятся.
Многие, когда верстают сайт, сталкиваются со следующей проблемой: поля по краям документа, которые, они не знают, как убрать. Что я имею ввиду – посмотрите пример, и вы увидите те самые поля, которые так нам часто мешают жить: посмотрите пример.
К счастью, если нам нужно мы можем управлять ими: мы можем увеличить их, если они нам нужны, а если они нам не нужны, то мы можем убрать их. Рассмотрим вариант, когда нам нужно убрать поля документа:
<Body text="#000000" bgcolor="ffffff" topmargin="0" leftmargin="0">
Topmargin - определяет ширину верхнего поля документа, leftmargin - определяет ширину левого поля документа. Чтобы убрать поля мы приравняли эти параметры к нулю. Можете посмотреть, что у нас получилось.
Вы можете удивиться, в чем же специфичность этих параметров. Дело в том, что topmargin и leftmargin поддерживаются только Internet Explorer.
Но не стоит расстраиваться, Нетскейп (Netscape Navigator) не окажется за бортом, т.к. для этого броузера есть свои аналогичные специфические атрибуты для тега Body - marginheight и marginwidth. Marginheight - аналогичен topmargin, а marginwidth - аналогичен leftmargin.
Теперь, чтобы убрать отступы и для NN, и для IE, надо просто прописать все эти атрибуты вместе для тэга BODY:
<Body text="#000000" bgcolor="ffffff" topmargin="0" leftmargin="0" marginwidth="0" marginheight="0">
Таким образом, и в IE все будет хорошо, и NN будет не обижен, и многие другие броузеры тоже :).
Но не торопитесь перебежать на следующую ступеньку.
Topmargin и leftmargin в Интернет Иксплорер убирает только верхнее и левое поля документа. Чтобы убрать правое и нижнее надо ввести еще атрибуты rightmargin и bottommargin для тэга Body.
<Body text="#000000" bgcolor="ffffff" rightmargin="0" bottommargin="0" topmargin="0" leftmargin="0" marginwidth="0" marginheight="0">
Итак, мы узнали, как убирать поля в IE и NN. Но, что же с другими броузерами?
|
<style type="text/css"><!--
body{margin:0px;padding:0px;} --></style> |
Метки: Учебник по Html для чайников. |
Ступенька 30-ая. |
Дневник |
Ступенька 30-ая.
В последнее время я все реже и реже встречаю такой элемент, как линии. Теперь их увидишь разве что в гостевых книгах, или на форумах. Линия задается тэгом <Hr> и не требует закрывающего тэга:
Вот такая она, в форме канавочки. У линии есть много разных параметров:
|
(1) <Hr align="right"> (center или left)
(2) <Hr width="30%"> (ширина линии в процентах/пикселях) (3) <Hr size="6"> (толщина линии) (4) <Hr NoShade> (отмена объемности) (5) <Hr color="cc0000"> (цвет линии, только в IE) |
Метки: Учебник по Html для чайников. |
Ступенька 29-ая. |
Дневник |
Ступенька 29-ая.
Чтобы не затягивать повествование мы пропустили несколько нужных глав, уступив место таблицам, чтобы вы побыстрее освоили тот минимум, который вам необходим, чтобы построить (сверстать) сайт. Однако, чтобы сделать хороший и удобный сайт знания одного минимума не достаточно, поэтому я продолжаю свое повествование, и отдаю дань обиженным главам, выделяя для них целый раздел: Дополнительные.
Эта глава о спецсимволах. Они не так часто употребляются, но, тем не менее, они необходимы, с одним из спецсимволов мы познакомились, когда говорили о вложенных таблицах (символом неделимого пробела). Познакомимся еще с некоторыми наиболее часто употребляемыми спецсимволами:
|
(1) - < - <
(2) - > - > (3) - " - " (4) - - пробел (5) - & - & |
Метки: Учебник по Html для чайников. |
