|
| |
|
|
Ответов: 0
|
25-02-12 07:01
|
|
|
| |
|
|
Ответов: 0
|
16-01-12 20:13
|
|
|
| |
|
|
Ответов: 1
|
09-01-12 11:23
|
|
|
|
Web - программирование / HTML /
| |
| | |
Возможно вас заинтересует
|
|
Основные приемы форматирования html-страниц
Существует несколько разных способов форматирования элементов веб-страниц. Вообще под форматирование подразумевается придание им каких-либо нужных веб-дизайнеру атрибутов - например размер шрифта и его цвет.
Но в этой статье мы не будем рассматривать именно такую работу со стилями - как показала практика их лучше менять средствами каскадных таблиц стилей - CSS. А это уже тема других статей.
Вы уже знаете, что для разделения страницы горизонтальной полоской необходимо воспользоваться тегом <hr>. Теперь давайте рассмотрим еще несколько методов изменения внешнего вида элементов нашей веб-страницы
Форматирование текста
В нашей страничке у есть строка ссылок "<p><a href="index.html">Главная страница</a> - <a href="aboutme.html">Обо мне</a></p>".
Попробуем сделать текст ссылок более крупным. Это можно сделать с помощью тега <b>, который отвечает за жирный шрифт (bold.
Поэтому наша строка "<p><a href="index.html">Главная страница</a> - <a href="aboutme.html">Обо мне</a></p>" преобразуется в "<p><a href="index.html"><b>Главная страница</b></a> - <a href="aboutme.html"><b>Обо мне</b></a></p>".
Вот как это будет выглядеть в коде:
<p><a href="index.html"><b>Главная страница</b></a> - <a href="aboutme.html"><b>Обо мне</b></a></p>
|
Добавление изображений в веб-страницу
С помощью добавления изображений на страниц можно значительно увеличить ее привлекательность и добавить информативности. Пусть у вас есть изображение test.jpg, которое лежит в папке images. Тогда для его отображения на странице необходимо воспользоваться вот таким кодом:
<p><img src="/images/test.jpg" width="20" height="20" title="Some image" alt="Some image" /><p/>
|
У тега, который отвечает за вывод изображения, есть несколько параметров:
- Расположение изображения (директория).
- Ширина (width) и высота (height).
- Заголовок (title).
- Альтернативный текст (alt).
Параметры ширина и высота должны соответствовать реальным размерам изображения. В противном случае они уменьшат или увеличат его (естественно, что исходное изображение при этом останется прежних размеров).
Параметр заголовок используется для краткого описания картинки. Эта надпись появляется при наведении курсором мышки поверх картинки.
Последним, но не менее важным идет тег alt. Он очень важен для соответствия кода веб-страницы стандартам консорциума W3C. Этот тег отображается на месте изображения в том случае, если посетитель использует текстовый браузер или у него отключена функция отображения графики.
Такие поисковые машины, как Google и Яндекс (да и все остальные) могут использовать заголовки изображений для их индексации. В дальнейшем эта информация используется для поиска картинок по определенным ключевым словам.
Окончательный результат:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Моя домашняя страница</title>
</head>
<body>
<h1>My Cool Site!</h1>
<hr /> <p>
<a href="index.html"><b>Главная страница</b></a> -
<a href="aboutme.html"><b>Обо мне</b></a></p>
<hr />
<p>Привет всем! Это моя первая веб-страница. Надеюсь, она вам понравилась :)</p>
<p><img src="/images/test.jpg" width="20" height="20" title="Some image" alt="Some image" /><p/>
</body>
</html>
|
|
Последние статьи: Web - программирование / HTML /
| |
| | |
|
Указывает программе просмотра страниц что это HTML документ.
Определяет место, где помещается различная информация не отображаемая в теле документа. Здесь располагается тег названия документа и теги для поисковых машин.
Определяет видимую часть документа... подробнее
|
|
Кол. просмотров: общее - 6884 сегодня - 0
|
|
|
По статистике, около 90% пользователей в наши дни пользуются Internet Explorer (5-й или 6-й версией). В этих браузерах Flash, как правило, уже установлен... подробнее
|
|
Кол. просмотров: общее - 4898 сегодня - 0
|
|
|
Эту статью в 2000 году написал небезызвестный веб-разработчик Петер-Пауль Кох (Peter-Paul Koch), который поддерживает один из лучших ресурсов по JavaScript... подробнее
|
|
Кол. просмотров: общее - 4613 сегодня - 0
|
|
|
|
Кол. просмотров: общее - 4188 сегодня - 1
|
|
|
Всего несколько лет назад браузер Mosaic произвел сенсацию воспроизведением простых веб-страниц. Те дни давно канули в прошлое. Сегодня веб-страницы становятся все более сложными, как и применяемые для их создания технологии... подробнее
|
|
Кол. просмотров: общее - 5259 сегодня - 2
|
|
|
|
