ERR.Corpo

[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]

Страница 1 из 1
1

[Html] С чего начать? - часть 1

ERR-Wolond

Дата: Воскресенье, 01.05.2011, 08:47 | Сообщение # 1

Спецназовец ERR.Corpo

Зарегистрирован: 02.03.2011

Группа: Администраторы

Пользователь №: 1

Сообщений: 130

Репутация: 7

Статус: Offline

[HTML] С чего начать? - часть 1

Страницы сайта полностью состоят из различных тегов, имеющих разные свойства. Все теги в HTML обязательно должны быть заключены в угловые скобки, также для основной массы тегов обязательно должен быть закрывающий тег.
Для примера возьмем самый главный тег, который указывает браузеру на начало HTML-документа HTML.
Для этого тега обязательно должен быть закрывающий тег, который указывает на то, что документ закончен.
Все остальные теги должны располагаться внутри этих тегов.
Пример:

Code

<HTML>
<HEAD>
<TITLE>Заголовок страницы</TITLE>
</HEAD>
<BODY>
...Тут располагается тело страницы...
</BODY>
</HTML>

Как вы видите в примере выше - у каждого тега есть закрывающий тег в котором используется слеш (косая черта). Слеш обязательно должен находится перед названием тега (не после).
Скачать полный список тегов имеющихся в HTML с их описанием а также справочник свойств CSS вы можете ЗДЕСЬ.

Создаем простую HTML страницу.

Для удобства нам потребуется создать на компьютере отдельную папку. Название папки любое, например Site.
Далее создадим в этой папке текстовый документ, и назовем его index.html
Откройте index.html в блокноте, и вставьте в него следующие строки, как есть:

Code

<HTML>
<HEAD>
<TITLE>Новая страница</TITLE>
</HEAD>
<BODY>
Это пример простейшей страницы с одной ссылкой.
<br/>
<a href="http://css-standart.ru">Название ссылки</a>
</BODY>
</HTML>

Сохраняем изменения и открываем index.html в браузере.
Мы видим совершенно примитивную страницу, где немного текста и одна ссылка.
Нажав в ссылку - вы попадете на главную страницу нашего сайта, т.к. в URL ссылки как вы уже наверное заметили прописан адрес http://css-standart.ru .

ERR-Wolond

Дата: Воскресенье, 01.05.2011, 08:47 | Сообщение # 2

Спецназовец ERR.Corpo

Зарегистрирован: 02.03.2011

Группа: Администраторы

Пользователь №: 1

Сообщений: 130

Репутация: 7

Статус: Offline

Подключаем CSS

Теперь попробуем слегка изменить оформление нашей страницы с помощью CSS.
В этой же папке создадим новый текстовый документ и назовем его style.css .
Далее в index.html внутри тега HEAD нам потребуется прописать путь к файлу style.css .
Пример:

Code

<HTML>
<HEAD>
<TITLE>Новая страница</TITLE>
<LINK href="style.css" rel="stylesheet" type="text/css" />
</HEAD>
<BODY>
Это пример простейшей страницы с одной ссылкой.
<br/>
<a href="http://css-standart.ru">Название ссылки</a>
</BODY>
</HTML>

Откройте style.css в блокноте, и вставьте в него следующие строки, как есть:

Code

body{
text-align:center; /* выравниваем содержимое по центру */
background-color:#99FFCC; /* указываем цвет фона */
font-family:Georgia, Times, serif; /* указываем шрифт текста */
font-size:20px; /* указываем размер шрифта */
color:#996600; /* указываем цвет текста */
}

a {
font-family:Verdana, Arial, Helvetica, sans-serif; /* указываем шрифт ссылки */
font-size:28px; /* указываем размер текста ссылки */
color:#999933; /* указываем цвет ссылки */
text-decoration:none; /* убираем подчеркивание */
}

a:hover{
text-decoration:underline; /*

добавляем подчеркивание при наведении мыши */
} - сохраняем оба файла и обновляем страницу браузера.
Если вы все сделали правильно - увидите как сильно изменилась страница, если вы не видите изменений - значит гдето допустили ошибку, перепроверьте правильность кода.

Можете поэксперементировать, вставляя в страницу какие-нибудь теги, руководствуясь справочником HTML и CSS, который вам было предложено скачать (выше). Проверяйте изменения, обновляя страницу в браузере и не забывая предварительно сохранять изменения в index.html и style.css.

[Html] С чего начать? - часть 1

Страница 1 из 1
1