Создание сайта

Создание простого сайта с CSS

Поэтапное создание собственного сайта с нуля


Делаем самый простой сайт с CSS.

В предыдущей статье мы познакомились с табличным методом создания сайта.Разберем как создать сайт с помощью блочного метода CSS.CSS имеет свой синтаксис ,или правило описания стилей для элементов HTML.Эти стили CSS могут записываться прямо на странице, но в большинстве случаев они записываются в отдельном документе, а на странице дается ссылка на этот документ.

Это одно из основных преимуществ CSS перед таблицами HTML ,так как изменив какой нибудь параметр в стиле CSS ,этот параметр сразу изменится на всех страницах сайта.В большинстве случаев на сайте используется и CSS и таблицы HTML. Возьмём тот же простейший сайт,который мы рассматривали на главной странице.

Его уменьшенный вид:

Создание сайта Создание собственного сайта.




Это код данного сайта.
<html>
<head>
<title>
Создание сайта
</title>

<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
</head>
<body>
Создание собственного сайта.
<img src="images/com (8).gif" width=213 height=170 border=0>
</body>
</html>

Напишем стили CSS прямо на странице сразу после тега <body> и разобьем нашу страницу на 2 блока,что бы поместить текст в один блок , а рисунок во второй .

<style type="text/css">
.content{
/* Создаем класс "content" */
margin: 10px 15px 5px 15px;
}
.pic{
/* Создаем класс "pic" */
margin: 10px 15px 5px 15px;
}
</style>


Вставляем класс "content" перед текстом и после текста закрываем его. Так же вставляем класс "pic" перед рисунком и также после закрываем.

Создание сайта
Создание собственного сайта.



Полностью код этой страницы с CSS выглядит так:

<html>
<head>
<title>Создание сайта </title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
</head>
<body>
<style type="text/css">
.content{

margin: 10px 15px 5px 15px;
font: 150% Georgia; }
.pic{

margin: 10px 15px 5px 15px;
}
</style>

<div class="content">
Создание собственного сайта.</div>
<div class="pic"><img src="images/com (8).gif" width=213 height=170 border=0></div>
</body>
</html>


Посмотрите стили CSS здесь


Справка
Для сайта


Для создания сайта вам потребуется текстовый редактор.На крайний случай можно воспользоваться Блокнотом из стандартных программ Windows,но лучше сразу скачать текстовый редактор предназначенный для создания сайтов,например Notepad.


У вас на компьютере должны быть установлены основные браузеры Internet Explorer,Opera, Google,Firefox, для обработки графики должен быть установлен графический редактор к примеру бесплатный Photoscape.


Для закачки файлов вашего сайта на хостинг скачайте и установите FTP-клиент,к примеру бесплатный Filezilla.


Также установите простую программу для анимации.

Стоит обратить внимание на безопасность вашего компьютера.Наличие своего сайта предполагает частое пользование почтой на сайте, приходящих писем на ваш почтовый ящик,посещение различных ресурсов в интернете, поэтому антивирусные программы обновляйте постоянно.

Чаще производите чистку и дефрагментацию жестких дисков. Раз в месяц производите проверку и исправление ошибок реестра.





Новые Технологии



Наверх