-Музыка

 -Метки

2012 3 способа снять квартиру html twilight web прогр. агрессия аллергия анонимность в интернете аромат года борьба с педофилией босс не прав бритва или эпиляция взлом share-ware взлом skype взлом программ выбор продуктов гости дефрагментация диска дизайн домик у реки доставка женская дружба жилец в подарок запах привлекатальности защита сервера интервью с богом интернет-зависимость история хакерства как выбрать комп.стол как выбрать монитор как зайти вконтакт как подобрать себе аромат комп и здоровье комп своими руками конверт.аудио координаты косметика и беременность ч1 косметика и беременность ч2 красим волосы дома крякинг кутикула макияж мода 2010 модные цвета 2010 молочные советы. музыка на новом месте налог налог на недвижимость неприватизированная квартира новинки новый год тигра новый каталог ногти обувь первый раз включили комп перспективы рынка недвижимости погода подарки подбор цвета подключить комп к телевизору поиск дров покупка недостроенного жилья помощь против рака профессия раздел имущества регистр.на сайтах рекомендации ч3 рекомендации ч4 рекомендации ч5 рецепт успеха с юморком скардить скидка собеседование советы советы для женщин советы хозяйке создать почтовый ящик сокращение штата сотрудничество спец символы html сроки годности типы фигур торрент туннельный синдром удаление вирусов узнать ip и скорость инета умение отказать ч2 уроки красоты устная договоренность в аренде уход за волосами зимой уход за шеей феромоны хакерство эксклюзив этикет этикетка ювенальная юстиция

 -Поиск по дневнику

Поиск сообщений в yulianna_incognito

 -Подписка по e-mail

 

 -Статистика

Статистика LiveInternet.ru: показано количество хитов и посетителей
Создан: 04.12.2009
Записей: 177
Комментариев: 13
Написано: 218

Комментарии (0)

html для чайников)))

Дневник

Четверг, 01 Июля 2010 г. 18:24 + в цитатник

Ступенька 1-ая.

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

D:\первые шаги\

У себя на компьютере я создала такую папку на диске D, и назвала ее Первые Шаги. Вы, естественно, можете создать вашу папку, где угодно, и назвать ее, как угодно. Теперь откроем блокнот – notepad (start – programs – accessories – notepad или пуск – программы – стандартные – блокнот) и скопируем туда следующий текст:


<html>
<head>
<title>Мой первый шаг </title>
</head>
<body>
Здравствуйте, это моя первая страница.
<br>
Рейтинг@Mail.ruRambler's Top100
Добро пожаловать! :)
</body>
</html> (
посмотреть
)

Сохраним этот документ, присвоив ему имя *.html

D:\первые шаги\index.html

Многие читатели спотыкаются на фразе: "А теперь сохраним этот документ, присвоив ему имя *.html", они пишут письма, о том, что у них получается сохранить, только как текстовой документ *.txt, а вот как *.html - никак. Чтобы в дальнейшем избежать этого глупого недоразумения, я и пишу это примечание.

Если вы сохраняете документ, через Файл -> Сохранить (File -> Save), то, естественно, что он сохраняется как *.txt. Надо сохранять ваш документ следующим образом:

- Файл -> Сохранить Как (File -> Save as)
- Дальше вводите имя своего документа, например: index.html (а не просто index; приписочка *.html должна быть обязательно).
- Если вы уже сохранили ваш документ, как *.html, то при внесении изменений в этот документ вы можете уже сохранять их через Файл -> Сохранить (File -> Save).

Вот и все. Надеюсь, теперь у всех все будет в порядке.

Теперь откроем броузер, допустим, Internet Explorer (не закрывайте блокнот, он нам еще пригодится), и откроем в броузере наш документ.

Файл - Открыть - кнопка Обзор - Наш документ (index.html)
File – Open – Browse – index.html

Если мы чего-то изменим в нашем *.html документе (в блокноте), то, чтобы посмотреть, как это выглядит в нашем броузере, надо не забывать нажимать в броузере кнопку ОБНОВИТЬ. Если изменений не видно, то это значит, что вы где-то что-то неправильно написали, или забыли сохранить документ.

Посмотрим теперь, что у нас получилось, и разберемся, как оно так получилось :)

Ступенька 2-ая.


<html>
<head>
<title>Мой первый шаг </title>
</head>
<body>
Рейтинг@Mail.ruRambler's Top100
Здравствуйте, это моя первая страница.
<br>
Добро пожаловать! :)
</body>
</html> (
посмотреть
)

Первое, что нам нужно усвоить: хтмл (html) - это то, что мы сейчас изучаем. Второе, что нам нужно усвоить: html не является языком программирования, он предназначен для разметки текстовых документов (т.е. с помощью него мы размечаем текст, таблицы, картинки и т.д. на нашей странице). То, как будут выглядеть картинки, текст и другие элементы на вашей странице, и как они будут располагаться относительно друг друга, определяют метки (tags или тэги).

Пример тэга: <br> (перенос текста на другую строку). Попробуйте вставить еще несколько тэгов <br> в нашем документе перед «добро пожаловать!». Сохраните. Посмотрите в вашем броузере, что получилось.

Итак, все, что находится между < и > - это тэг. Текст, не находящийся между такими скобками < > - весь виден при просмотре в броузере.

Как мы видим на нашем примере: тэгов много, и они разные :). Обратите внимание на картинку, она тут не просто так, она показывает нам обязательные тэги. Обязательные теги, это такие теги, которые вы всегда должны прописывать для каждой своей страницы, даже не смотря на бури, ураганы и другие стихийные бедствия.

<html>

Этот тэг должен открывать документ. Если есть открывающий тэг, то должен быть и закрывающий:

</html>

Некоторые тэги, вроде <br>, не требуют закрывающего тэга.

Итак, вернемся, к нашему документу и рисунку.

Ступенька 3-ая.


<html>
<head>
<title>Мой первый шаг</title>
</head>
<body>

Здравствуйте, это моя первая страница.
<br>
Добро пожаловать! :)
</body>
</html> (
посмотреть)

<head> </head> - голова документа
<body> </body> - тело документа

Все тэги, расположенные между <head> </head>, это что-то вроде служебной информации (наша служба и опасна и трудна, и на первый взгляд как будто не видна:). Например <title>- заголовок. Зачем он? Откройте IE (Internet Explore) с нашим документом и устремите свой взгляд на заголовок окна... Увидели?:)

Все тэги, расположенные между <body> </body> - непосредственное содержание документа. Следующие несколько ступенек будут посвящены именно этим тэгам: мы узнаем, как менять цвет текста, фона, как делать текст крупнее-мельче, поговорим о картинках, таблицах и многом другом. Но прежде, все-таки закончим наш разговор о тэгах, в общем.

<тэг> </тэг> - не просто тэг, это контейнер - тэг, который может содержать внутри себя другие тэги (и текст).

Обратите внимание:

<тэг1><тэг2><тэг3> ... </тэг3></тэг2></тэг1>
Рейтинг@Mail.ruRambler's Top100

Только такая очередность закрывающих тэгов верна: тэг, который мы открыли первым - закрываем последним, второй – предпоследним и т.д.

Т.е. следующая очередность нежелательна и не верна, она может привести к ошибкам на вашей страничке:

<тэг1><тэг2><тэг3> ... </тэг3></тэг1></тэг2>

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

 

Рубрики:  комп для "чайников"

Метки:  

 Страницы: [1]