Владимир Дронов - HTML 5, CSS 3 и Web 2.0. Разработка современных Web-сайтов
Здесь можно купить и скачать "Владимир Дронов - HTML 5, CSS 3 и Web 2.0. Разработка современных Web-сайтов" в формате fb2, epub, txt, doc, pdf. Жанр: Прочая справочная литература, издательство БХВ-Петербург, год 2011. Так же Вы можете читать ознакомительный отрывок из книги на сайте LibFox.Ru (ЛибФокс) или прочесть описание и ознакомиться с отзывами.
Название:
HTML 5, CSS 3 и Web 2.0. Разработка современных Web-сайтов
Автор:
Издательство:
неизвестно
Год:
2011
ISBN:
978-5-9775-0596-3
Скачать:
Вы автор?
Книга распространяется на условиях партнёрской программы.
Все авторские права соблюдены. Напишите нам, если Вы не согласны.
Все авторские права соблюдены. Напишите нам, если Вы не согласны.
Как получить книгу?
Оплатили, но не знаете что делать дальше? Инструкция.
Описание книги "HTML 5, CSS 3 и Web 2.0. Разработка современных Web-сайтов"
Описание и краткое содержание "HTML 5, CSS 3 и Web 2.0. Разработка современных Web-сайтов" читать бесплатно онлайн.
Практическое руководство по созданию современных Web-сайтов, соответствующих концепции Web 2.0. Описаны языки HTML 5 и CSS 3, применяемые, соответственно, для создания содержимого и представления Web-страниц. Даны принципы Web-программирования на языке JavaScript с использованием библиотеки Ext Core. Рассказано о создании интерактивных Web-страниц, приведены примеры интерактивных элементов, позволяющие сделать Web-страницы удобнее для посетителя. Раскрыты вопросы реализации подгружаемого и генерируемого содержимого, семантической разметки, применения баз данных для формирования Web-страниц. Показаны способы расширения функциональности Web-сайтов с использованием Web-форм, элементов управления, свободно позиционируемых элементов и программного рисования средствами HTML 5.
Абзац — это независимый элемент Web-страницы, который отображается отдельно от других элементов. Такие элементы Web-страницы называются блочными, или блоками.
Правила отображения текста абзаца Web-обозревателем:
— два и более следующих друг за другом пробела считаются за один пробел;
— перевод строки считается за пробел;
— пробелы и переводы строки между тегами, создающие блочные элементы, никак не отображаются на Web-странице. (Благодаря этому мы можем форматировать HTML-код для более удобного чтения, в том числе ставить отступы для обозначения вложенности тегов.)
Эти же правила справедливы для других блочных элементов, которые мы изучим в этой главе.
Настало время попрактиковаться. Давайте создадим главную Web-страницу нашего первого Web-сайта — справочника по HTML и CSS. Откроем Блокнот и наберем в нем HTML-код, приведенный в листинге 2.1.
Листинг 2.1
<!DOCTYPE html>
<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8">
<TITLE>Справочник по HTML и CSS</TITLE>
</HEAD>
<BODY>
<P>Справочник по HTML и CSS</P>
<P>Приветствуем на нашем Web-сайте всех, кто занимается Web-дизайном! Здесь вы сможете найти информацию обо всех интернет-технологиях, применяемых при создании Web-страниц. А именно, о языках HTML и CSS.</P>
<P>Русская Википедия определяет термин HTML так:</P>
<P>HTML (от англ. HyperText Markup Language — язык разметки гипертекста) — стандартный язык разметки документов во Всемирной паутине.</P>
<P>Пожалуй, ни убавить ни прибавить…</P>
<P>HTML позволяет формировать на Web-страницах следующие элементы:</P>
<P>абзацы;</P>
<P>заголовки;</P>
<P>цитаты;</P>
<P>списки;</P>
<P>таблицы;</P>
<P>графические изображения;</P>
<P>аудио- и видеоролики.</P>
<P>Основные принципы HTML</P>
<P>. </P>
<P>Теги HTML</P>
<P>!DOCTYPE, BODY, EM, HEAD, HTML, META, P, STRONG, TITLE</P>
</BODY>
</HTML>
Пока это только заготовка для главной Web-страницы. Позднее мы будем дополнять и править ее.
Создадим папку, куда будем "складывать" файлы, составляющие наш Web-сайт. И сохраним в этой папке набранный HTML-код, дав файлу имя index.htm. Как мы помним из главы 1, файл главной Web-страницы Web-сайта должен иметь имя index.htm[l] (или default.htm[l], но это встречается реже).
ВНИМАНИЕ!
Впоследствии мы будем сохранять все файлы, составляющие наш Web-сайт, в специально созданной папке. Если какой-либо файл нужно сохранить где-то еще, автор сообщит об этом особо.
Сразу же откроем созданную Web-страницу в Web-обозревателе — так мы сразу сможем определить, нет ли ошибок. Если ошибки все-таки есть, исправим их.
Пока что наша Web-страничка содержит одни абзацы. Первое, что мы должны в нее добавить, — это…
Заголовки
Помимо абзацев, большой текст для удобства чтения и поиска в нем нужного фрагмента обычно делят на более крупные части: параграфы, главы, разделы. HTML не предоставляет средств для такого структурирования текста. Но он позволяет создать заголовки, которые делят текст на части, по крайней мере, визуально. Как в обычной "бумажной" книге.
Прежде всего, уясним, что в HTML есть понятие уровня заголовка, указывающее, насколько крупную часть текста открывает данный заголовок. Всего таких уровней шесть, и обозначаются они числами от 1 до 6.
— Заголовок первого уровня (1) открывает самую крупную часть текста. Как правило, это заголовок всей Web-страницы. Web-обозреватель выводит заголовок первого уровня самым большим шрифтом.
— Заголовок второго уровня (2) открывает более мелкую часть текста. Обычно это большой раздел. Web-обозреватель выводит заголовок второго уровня меньшим шрифтом, чем заголовок первого уровня.
— Заголовок третьего уровня (3) открывает еще более мелкую часть текста; обычно главу в разделе. Web-обозреватель выводит такой заголовок еще меньшим шрифтом.
— Заголовки четвертого, пятого и шестого уровней (4–6) открывают отдельные параграфы, крупные, более мелкие и самые мелкие соответственно. Web- обозреватель выводит заголовки четвертого и пятого уровня еще меньшим шрифтом, а заголовок шестого уровня — тем же шрифтом, что и обычные абзацы, только полужирным.
На Web-страницах небольшого и среднего размера обычно применяют заголовки первого, второго и третьего уровня. Меньшие уровни используются только на очень больших Web-страницах, содержащих сложно структурированный текст.
Для создания заголовка HTML предоставляет парный тег <Hn>, где n — уровень заголовка. Содержимое этого тега станет текстом заголовка (листинг 2.2).
Листинг 2.2
<H1>Я — заголовок Web-страницы, самый главный</H1>
<H2>Я — заголовок раздела</H2>
<H3>Я — заголовок главы</H3>
<H4>Я — заголовок крупного параграфа</H4>
<H5>Я — заголовок параграфа поменьше</H5>
<H6>А я — заголовок маленького параграфа. Ой, какие все вокруг большие!..</H6>
Заголовок также относится к блочным элементам Web-страницы. При его выводе на экран Web-обозреватель следует тем же правилам, что и для абзаца.
Заголовки — это то, чего не хватает нашей Web-страничке index.htm. Давайте их добавим (листинг 2.3).
Листинг 2.3
<H1>Справочник по HTML и CSS</H1>
.
<H2>Основные принципы HTML</H2>
.
<H2>Теги HTML</H2>
Мы просто заменили теги <P> в соответствующих фрагментах HTML-кода на теги
<H1> и <H2>. Теперь можем открыть Web-страницу в Web-обозревателе и посмотреть на результат.
Списки
Списки используются для того, чтобы представить читателю перечень каких-либо позиций, пронумерованных или непронумерованных, — пунктов списка. Список с пронумерованными пунктами так и называется — нумерованным, а с непронумерованными — маркированным. В маркированных списках пункты помечаются особым значком — маркером, который ставится левее пункта списка.
Маркированные списки обычно служат для простого перечисления каких-либо позиций, порядок следования которых не важен. Если же следует обратить внимание читателя на то, что позиции должны следовать друг за другом именно в том порядке, в котором они перечислены, следует применить нумерованный список.
Web-обозреватель выводит список с отступом слева. Расстояние между пунктами списка он делает меньшими чем в случае абзацев или заголовков. Также он сам расставляет необходимые маркеры или нумерацию.
Любой список в HTML создается в два этапа. Сначала пишут строки, которые станут пунктами списка, и каждую из этих строк помещают внутрь парного тега <LI>. Затем все эти пункты помещают внутрь парного тега <UL> (если создается маркированный список) или <OL> (при создании нумерованного списка) — эти теги определяют сам список (листинг 2.4).
Листинг 2.4
<UL>
<LI>Я — первый пункт маркированного списка.</LI>
<LI>Я — второй пункт маркированного списка.</LI>
<LI>Я — третий пункт маркированного списка.</LI>
</UL>
.
<OL>
<LI>Я — первый пункт нумерованного списка.</LI>
<LI>Я — второй пункт нумерованного списка.</LI>
<LI>Я — третий пункт нумерованного списка.</LI>
</OL>
Списки можно помещать друг в друга, создавая вложенные списки. Делается это
следующим образом. Сначала во "внешнем" списке (в который должен быть помещен вложенный) отыскивают пункт, после которого должен находиться вложенный список. Затем HTML-код, создающий вложенный список, помещают в разрыв между текстом этого пункта и его закрывающим тегом </LI>. Если же вложенный список должен помещаться в начале "внешнего" списка, его следует вставить между открывающим тегом <LI> первого пункта "внешнего" списка и его текстом. Что, впрочем, логично.
В листинге 2.5 представлен HTML-код, создающий два списка, один из которых вложен внутрь другого. Обратите внимание, где размещается HTML-код, создающий вложенный список.
Листинг 2.5
<UL>
<LI>Я — первый пункт внешнего списка.</LI>
<LI>Я — второй пункт внешнего списка.
<UL>
<LI>Я— первый пункт вложенного списка.</LI>
<LI>Я— второй пункт вложенного списка.</LI>
<LI>Я— третий пункт вложенного списка.</LI>
</UL>
</LI>
<LI>Я — третий пункт внешнего списка.</LI>
</UL>
HTML позволяет вкладывать нумерованный список внутрь маркированного и наоборот. Глубина вложения списков не ограничена.
На Facebook
В Твиттере
В Instagram
В Одноклассниках
Мы Вконтакте
Подписывайтесь на наши страницы в социальных сетях.
Будьте в курсе последних книжных новинок, комментируйте, обсуждайте. Мы ждём Вас!
Подписывайтесь на наши страницы в социальных сетях.
Будьте в курсе последних книжных новинок, комментируйте, обсуждайте. Мы ждём Вас!
Похожие книги на "HTML 5, CSS 3 и Web 2.0. Разработка современных Web-сайтов"
Книги похожие на "HTML 5, CSS 3 и Web 2.0. Разработка современных Web-сайтов" читать онлайн или скачать бесплатно полные версии.
Понравилась книга? Оставьте Ваш комментарий, поделитесь впечатлениями или расскажите друзьям
Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь.
Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.
Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.
Отзывы о "Владимир Дронов - HTML 5, CSS 3 и Web 2.0. Разработка современных Web-сайтов"
Отзывы читателей о книге "HTML 5, CSS 3 и Web 2.0. Разработка современных Web-сайтов", комментарии и мнения людей о произведении.