Игорь Квинт - HTML, XHTML и CSS на 100%
Здесь можно купить и скачать "Игорь Квинт - HTML, XHTML и CSS на 100%" в формате fb2, epub, txt, doc, pdf. Жанр: Интернет, издательство Издательство «Питер»046ebc0b-b024-102a-94d5-07de47c81719, год 2010. Так же Вы можете читать ознакомительный отрывок из книги на сайте LibFox.Ru (ЛибФокс) или прочесть описание и ознакомиться с отзывами.
Название:
HTML, XHTML и CSS на 100%
Автор:
Издательство:
неизвестно
Жанр:
Год:
2010
ISBN:
978-5-49807-594-5
Скачать:
Вы автор?
Книга распространяется на условиях партнёрской программы.
Все авторские права соблюдены. Напишите нам, если Вы не согласны.
Все авторские права соблюдены. Напишите нам, если Вы не согласны.
Как получить книгу?
Оплатили, но не знаете что делать дальше? Инструкция.
Описание книги "HTML, XHTML и CSS на 100%"
Описание и краткое содержание "HTML, XHTML и CSS на 100%" читать бесплатно онлайн.
Вы хотите создать собственный сайт на просторах Интернета? Причем желательно, чтобы он был красивым, удобным и «неглючным»? Казалось бы, чего проще: существует столько программ – конструкторов сайтов. Однако чтобы создать действительно профессиональный сайт, подобных утилит недостаточно. Вам потребуется знание языков программирования HTML и XHTML, а также каскадных таблиц стилей CSS. И в этом случае книга, которую вы держите в руках, – именно то, что вам необходимо. С ее помощью вы научитесь создавать красиво оформленные, быстрые и профессиональные сайты. С этой книгой ваша страничка никогда не останется незамеченной в Сети!
Элемент SUP задает надстрочное написание символов, то есть текст располагается выше базовой линии и становится меньшего размера. Этот элемент используют при написании формул.
Пример:
<sup>Надстрочный</sup> шрифт
Элемент SPANЭлемент SPAN позволяет выделить часть текста и определить для нее особые параметры отображения с помощью таблиц стилей. Он применяется для выделения небольших областей текста.
Пример:
<span style="background-color:#00FFFF">Текст с фоном</span>
В листинге 2.17 представлен код страницы с различным форматированием текста.
Листинг 2.17. Физическое форматирование<html>
<head>
<title>Элементы физического форматирования</title>
<body>
<b>Полужирный шрифт</b><br />
<i>Курсив</i><br />
<tt>Моноширинный шрифт</tt><br />
<u>Подчеркнутый</u><br />
<s>Зачеркнутый</s><br />
<strike>Снова зачеркнутый</strike><br />
Шрифт <big>побольше <big>Еще больше</big></big><br />
Шрифт <small>поменьше</small><br />
<sub>Подстрочный</sub> шрифт<br />
<sup>Надстрочный</sup> шрифт<br />
<span style="background-color:#00FFFF">Текст с фоном</span>
</body>
</html>
Результат обработки браузером кода из листинга 2.17 представлен на рис. 2.17.
Рис. 2.17. Физическое форматирование
На рис. 2.17 видно, что любой физический элемент форматирования изменяет вид текста, потому что именно это является его функцией.
Как видно из описания, зачастую действие логических и физических элементов дублируется. В принципе, рекомендуется использовать логические элементы форматирования, так как они определяют суть фрагмента текста.
В табл. 2.1 кратко описаны аналоги рассмотренных физических элементов среди логических элементов и показано, какие элементы являются взаимозаменяемыми.
Таблица 2.1. Элементы форматирования текстаКак видно из таблицы, для многих физических элементов форматирования можно найти логические аналоги, которые намного лучше опишут смысловую нагрузку выделенного текста.
Все рассмотренные выше элементы применимы для форматирования небольших блоков текста. Дальше мы рассмотрим элементы, которые можно применять для изменения внешнего вида крупных текстовых блоков.
Элементы для форматирования больших блоков текста
Элементы, которые мы рассмотрим в этом подразделе, позволяют форматировать большие блоки текста. Они определяют параметры отображения и расположения текста, заключенного в их блок.
Начнем рассмотрение с элемента, напрямую отвечающего за параметры шрифта.
Элемент FONTЭлемент FONT задает параметры шрифта для текста. Хотя для форматирования предпочтительнее использовать таблицы стилей, некоторые простые документы допускают и такое определение параметров текста.
Параметры текста задаются с помощью атрибутов элемента FONT. Можно определить шрифт, размер и цвет текста, расположенного внутри него.
За шрифт отвечает атрибут face, значением которого должно быть название шрифта. Однако название должно быть знакомо компьютеру пользователя, иначе будет применен шрифт по умолчанию. Для решения проблемы несоответствия или отсутствия шрифтов можно задать несколько допустимых типов, введя их через запятую в качестве значения атрибута face.
За размер шрифта отвечает атрибут size. Значение задается в относительных величинах, то есть 2 или 6. По умолчанию используется размер 3. При этом можно задать размер шрифта относительно остального текста. Для этого нужно сначала указать +, если необходимо, чтобы размер шрифта на данном участке был больше, чем основной текст, или —, если требуется обратное форматирование. После знака надо указать количество пунктов, на которое текст должен быть больше или меньше.
За цвет шрифта отвечает атрибут color, значением которого должно быть либо ключевое слово, обозначающее имя цвета, либо код цвета в формате #RRGGBB.
Совет
Код цвета можно посмотреть в любом графическом редакторе.
В листинге 2.18 показан пример кода для определения параметров текста с помощью элемента FONT.
Листинг 2.18. Использование элемента FONT<html>
<head>
<title>Элемент FONT</title>
<body>
<font color="#FF0000" face="Verdana, Arial, Helvetica, sans-serif" size="+2">
Текст красного цвета с размером +2
</font><br />
<font color="#FF00FF" face="Verdana, Arial, Helvetica, sans-serif" size="-4">
Текст фиолетового цвета с размером –4
</font><br />
</body>
</html>
Результат вывода на экран кода из листинга 2.18 показан на рис. 2.18.
Рис. 2.18. Использование элемента FONT
В примере задан список похожих шрифтов. Браузер будет просматривать список по порядку и выведет текст тем шрифтом, который найдет первым. В качестве последнего варианта указан не шрифт, а семейство шрифтов Sans Serif. Если браузер не найдет ни один из перечисленных шрифтов, он возьмет известный ему шрифт из этого семейства.
Как задать параметры шрифта, мы разобрались. Однако этот метод не лучший. Как уже говорилось, удобнее задавать форматирование с помощью таблиц стилей.
Элемент DIVЭлемент DIV служит для выделения больших блоков текста под форматирование с помощью таблиц стилей. Иными словами, вы помещаете необходимый блок текста между тегами элемента DIV и либо задаете ему параметры в атрибуте style, либо подключаете класс из таблицы стилей с помощью атрибута class.
Единственное, что вы можете сделать с помощью HTML, – выровнять текст в блоке с помощью атрибута align и создать всплывающую подсказку для блока с помощью атрибута title.
В листинге 2.19 представлен пример кода для выделения текста с помощью элемента DIV.
Листинг 2.19. Использование элемента DIV<html>
<head>
<title>Элемент DIV</title>
<body>
<div style="cursor:crosshair" align="center">
Текст внутри этого элемента выровнен по центру, а с помощью стилей задается вид указателя мыши при наведении на этот блок.
</div>
</body>
</html>
Результат обработки кода из листинга 2.19 показан на рис. 2.19.
Рис. 2.19. Использование элемента DIV
Теперь рассмотрим ситуацию, когда у вас уже есть отформатированный нужным образом текст и вы не хотите ничего менять.
Элемент PREЭтот элемент служит для ввода текста без форматирования, то есть с сохранением всех пробелов и переносов строк.
Примечание
Обычно в HTML несколько пробелов подряд воспринимаются как один пробел.
При использовании этого элемента текст выводится моноширинным шрифтом. Элемент PRE часто используют для вывода кодов программ. Внутри этого элемента можно применять большинство элементов форматирования текста.
В листинге 2.20 приведен пример использования элемента PRE.
Листинг 2.20. Использование элемента PRE<html>
<head>
<title>Элемент PRE</title>
<body>
<pre>
Здесь
можно
расположить
код
программы
</pre>
</body>
</html>
На рис. 2.20 показано, как текст, расположенный между тегами элемента PRE, выглядит в браузере.
Рис. 2.20. Использование элемента PRE
Далее рассмотрим элемент, предназначенный для форматирования больших объемов текста и отвечающий за цитаты.
Элемент BLOCKQUOTEЭлемент BLOCKQUOTE определяет выделенный текст как цитату и применяется для описания больших высказываний. Он задает для текста отступы сверху, снизу и слева. Внутри этого элемента могут присутствовать элементы форматирования текста.
В листинге 2.21 представлен пример выделения цитаты с помощью элемента BLOCKQUOTE.
Листинг 2.21. Ввод больших цитат<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Элемент BLOCKQUOTE</title>
<body>
<blockquote>
Здесь можно расположить важную и большую цитату.
</blockquote>
</body>
</html>
На рис. 2.21 показано, как в браузере выглядит текст из элемента BLOCKQUOTE.
Рис. 2.21. Использование элемента BLOCKQUOTE
Мы рассмотрели, как действует каждый вариант форматирования текста отдельно, но HTML позволяет вкладывать элементы, при этом объединяя их действие.
Вложение элементов
Язык HTML позволяет вкладывать элементы форматирования друг в друга. При этом их действия суммируются. Если вложить в элемент B элемент I, то получится текст, написанный полужирным курсивом. При этом нужно следить за правильным закрытием элементов: тот, что открыт раньше, закрывается позже.
В листинге 2.22 показаны примеры правильного и неправильного вложения элементов.
На Facebook
В Твиттере
В Instagram
В Одноклассниках
Мы Вконтакте
Подписывайтесь на наши страницы в социальных сетях.
Будьте в курсе последних книжных новинок, комментируйте, обсуждайте. Мы ждём Вас!
Подписывайтесь на наши страницы в социальных сетях.
Будьте в курсе последних книжных новинок, комментируйте, обсуждайте. Мы ждём Вас!
Похожие книги на "HTML, XHTML и CSS на 100%"
Книги похожие на "HTML, XHTML и CSS на 100%" читать онлайн или скачать бесплатно полные версии.
Понравилась книга? Оставьте Ваш комментарий, поделитесь впечатлениями или расскажите друзьям
Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь.
Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.
Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.
Отзывы о "Игорь Квинт - HTML, XHTML и CSS на 100%"
Отзывы читателей о книге "HTML, XHTML и CSS на 100%", комментарии и мнения людей о произведении.