|
K@ry
| Дата: Понедельник, 26.12.2011, 15:39 | Сообщение # 1 |
|
Злая админка
Группа: Администраторы
Сообщений: 53
Репутация: 0
Итак, начнём с простого.
Все, кто хотя бы чуть-чуть знают о сойтостроении понимают, что страницы на самом деле состоят из кодов.
И начинается каждая такая страница с кода html.
Чтобы набор букв стал тегом его замыкают этими <> значками.
Составим основные понятия.
тег - набор букв на латиннице, с помощью которых складываются страницы.
Они выглядят так
<p>,<h1>,<head> и т.д.
С открываюшего тега код начинается, а закрывающим заканчивается. Закрывающий выглядит так </>.
Между открывающим тегом <html> и закрывающим </html> содержится весь код вашего сайта.
Он делится на три подраздела - шапка, центральная часть и так называемый подвал.
1) Шапка
Традиционно там располагается название сайта, картинка а так же какие-нибудь элементы навигации. Может, горизонтальное меню, время, информация о сайте.
Начинается шапка с тега <head>, а заканчивается </head>.
Ucoz же имеет свои, особые коды которые работают только в данном хостинге.
К примеру, $SITE_NAME$ - название сайта, которое прописывается в head.
2) Основная часть сайта
Зовётся <body> - тело сайта, вся основная информация о странице содержится именно тут.
Хотя удобнее прописывать всё в css, но об этом позднее.
3) Подвал
<footer>
Он расположен внизу страницы и содержи информацию о создателе сайта, копирайт и т.п
Для ucoz`а - часть обязательная, если же вы делаете свой сайт то это скорее для красоты.
Пример:
Code
<html>
<head>
<title>Заголовок нашей страницы (в ucoz`е $SITE_NAME$ – $MODULE_NAME$)</title>
</head>
<body>
текст страницы
</body>
</html> | |
| |
| |
|
K@ry
| Дата: Понедельник, 26.12.2011, 16:35 | Сообщение # 2 |
|
Злая админка
Группа: Администраторы
Сообщений: 53
Репутация: 0
Теперь немного подробнее.
Ранее я упоминала тег <title>, но не объяснила зачем он нужен.
Надеюсь, вы и так поняли.
Этот тег обозначает заголовок. Он необходим для каждой страницы.
Ещё немного полезных тегов:
table (таблица), ul (список), img (картинки), a (ссылки), p (абзац)
Работа с сылками
A href="ссылка" - ссылка на страницу. Если же вы хотите, что бы вместо ссылки красовалась картинка пишем img src="ссылка на изображение". И не забывайте про <>!
Так же вы можете сделать так, что бы вместо ссылки был текст.
<a href=”ссылка”>Текст</a>
В оформлении баннера пригодится всё это. Вот пример баннера:
Code <a href="http://bookenvip.ucoz.ru/"><img src="http://i20.fastpic.ru/big/2011/0426/55/0f227c9b6bb4745d523ceb7909dd7e55.gif"title="Fan-World" width="88" border="0" height="31"></a>
Как мы разбирали ранее, первый кусок, a href, делает картинку img src, кликаберной, а title показывает название сайта при наведении на картинку.
А теперь разберём те теги, что идут далее
Размеры
width - ширина. Это не обязательно должно быть изображение. Вы можете так же задать размер какой-то части страницы
height - высота
border - граница или рамка
Работа с текстом. Заголовки.
Заголовки обозначаются буквой h и цифрой от одного до шести. Цифры определяют размер заголовка. Чем меньше цифра, тем больше заголовок.
Атрибуты ALIGN - определяет способ выравнивания заголовка по горизонтали. Возможные значения: left, right, center.
Это работает не только с заголовками, но и со всеми текстами или картинками. Только тогда нужног использовать тег div: <DIV ALIGN="center">
Теги выравнивают по центру, по правому или левому краю.
Пример:
Code <h1 align="center">Самый большой заголовок посередине</h1>
<h2>Заголовок поменьше</h2>
...
<h6>самый маленький заголовок</h6> | |
| |
| |
|
K@ry
| Дата: Понедельник, 26.12.2011, 16:44 | Сообщение # 3 |
|
Злая админка
Группа: Администраторы
Сообщений: 53
Репутация: 0
Работа с текстом. Форматирование.
Позволяет изменять цвет, размер и тип шрифта текста, находящегося между начальным и конечным тегами.
Элементы font:
size - определяет размер шрифта.
color - определяет цвет текста.
face или family - определяет используемый шрифт.
Пример:
Code <FONT SIZE="8" COLOR="red">Увеличенный красный шрифт</FONT>
<FONT SIZE="5" FACE="Courier New" COLOR="#000000">Моноширинный чёрный текст размера 5 </FONT> | |
| |
| |
ФОРУМ 
