Урок HTML для самых маленьких

Июль 25, 2010 Александр Маврин 9 комментариев

Для тех, кто не знает, как делаются веб-страницы, объясню на простейших примерах.

Можете вместе со мной приступать к практике. А для начала немного теории. Содержимое страницы находится между тегами:

<body></body>

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

<html>
<head>
<title></title>
</head>
<body>
</body>
</html>

<html></html> Основной контейнер всей страницы

Второй тег это заголовок, в который вносятся служебные теги стилей и прочие элементы.

<title></title>

Название, которое отображается при наведении курсора на вкладку в браузере.
В теге:

<h1>пишем заголовок страницы</h1>

Между тегами:

<body>содержится основной контент страницы</body>

Итак, рассмотрим на примере. Откройте любой текстовой редактор, который у Вас есть. Подойдет простой блокнот. Если же ничего подходящего нет, то можно совершенно бесплатно скачать в интернете. Их там огромное множество. Например Notepad++.
Пишем в редакторе:

<html>
<head>
<title>Этот заголовок отображается во вкладке браузера</title>
</head>
<body text="#336699" bgcolor="#CCFFFF">
<div align="center">
<h1>Добро пожаловать на мой сайт</h1>
<br />
Здесь располагается основной текст на странице сайта
</div>
</body>
</html>

Я добавил для наглядности еще несколько тегов, а именно:

<div align="center">-блок, располагающий содержимое по центру</div>

<h1>-Размер шрифта. Так, как это заголовок, я поставил более крупный.</h1>

<br />-Перенос на следующую строку. (не требует закрывающего тега)

<body text="#336699" bgcolor="#CCFFFF"> - цвет текста и фона страницы.
 Если не указывать эти значения, по умолчанию будет черным по белому.</body>

И обязательно сохраняйте этот файл в формате html, иначе ничего не выйдет. Например index.html

Теперь сохраните и открывайте в браузере, смотрите, что у Вас получилось.

Вот собственно и все для первого раза. Посмотрите и сравните, должно выглядеть вот так

Популярность: 23% [?]

9 Комментария к Урок HTML для самых маленьких

BloggerMen:

03.08.2010 в 18:09

Просто и доступно. Новичкам полезно будет почитать.

Ответить
- Александр Маврин:
  
  03.08.2010 в 18:41
  
  Да, как раз для новичков и писал, чтобы было представление, как это работает.
  
  Ответить
Татьяна Колесникова:

09.01.2011 в 15:19

Спасибо большое за урок

Ответить
- Александр Маврин:
  
  09.01.2011 в 15:56
  
  Пожалуйста! Заходите еще.)
  
  Ответить
ринат:

05.03.2011 в 08:38

Нормально,но видео-аудио было бы лучше.
Большое спасибо за материал!!!
С УВАЖЕНИЕМ РИНАТ САЙФУТДИНОВ!

Ответить
Вячеслав:

03.04.2011 в 16:45

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

Ответить
- Александр Маврин:
  
  03.04.2011 в 18:16
  
  Скачать учебник по изучению языка HTML можно здесь. Для начинающих в самый раз.
  
  Ответить
Тамара Владимировна:

08.10.2011 в 04:32

Спасибо за такие уроки- только скажите мне,пожалуйста, , совершенно далекой( «чайнику») как Вы пишите- с нуля- какую литературу читать, чтобы потом можно было осознанно читать все выше написанное…

С уважением Тамара Владимировна.

Ответить
Александр Маврин:

08.10.2011 в 11:24

Начать можно как раз с этого учебника. А именно, с изучения основ HTML и CSS. И конечно практиковать. Без практики никуда. Ну и, как Вы понимаете, все это происходит медленно, как и любое другое обучение.

Ответить

Свежие записи

Облако меток

Урок HTML для самых маленьких

Читайте также

9 Комментария к Урок HTML для самых маленьких

Добавить комментарий Отменить ответ

Архив записей

Популярные записи