Суббота
04.05.2024
19:05

Сайт своими руками - фото-сайт

Приветствую Вас Гость | RSS Главная | Сайт своими руками | Регистрация | Вход
Меню сайта

Расчет расстояния между городами
От:  
До:  
Через:  
  (на ATI.su)
В гостях у Ирины
Поиск

Главная » FAQ » HTML


Основы HTML для новичков
Азы HTML для новичков

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

Добавление элемента html
Элемент html считаеться корневым элементом любого HTML-документа.
Корневой элемент языка html
<html> 
</html>

Достаточно просто не правда ли?

Элементы head и title

У нас уже есть основа с корневым элементом. Теперь добавляем элемент head. Данный элемент содержит все элементы , необходимые для отображения и выполнения документа, но которые не отображаются в окне браузера. Чтобы создать раздел head, необходимо просто добавить теги head в верхнюю часть шаблона, непосредственно за открывающимся тегом

<html> 

<head> 
</head> 

</html>
Элементы в разделе документа head
title - Этот элемент позволяет задать заголовок документа. Указанный заголовок будет отображаться в строке заголовка браузера. Элемент title являеться обязательным.
meta - Элемент meta используеться для множества целей, включая указание ключевых слов и описаний, кодировки символов и автора документа. Элемент meta не являеться обязательным и его использование может варьироваться в зависипости от поставленных задач.
script - Этот элемент позволяет вставлять скрипты непосредственно в документ, или, чот более предпочтительнго, с его помощью указываеться ссылка на необходимый для использования скрипт. Элемент используеться при необходимости.
style - Элемент style позволяет размещать информацию о стиле прямо на странице. Стиль, информация о котором размещена таким образом, называеться встроенным. Элемент используеться при необходимости.
link Элемент link наиболее часто используеться для выполнения связывания с внешней таблицей стилей, хотя он может приминятся и для других целей.

Элемент body
Это то место где происходят все действия. Это тото элемент, где будет размещено содержимое и произведена разметка страницы.
Элемент body размещен в элементе html, непосредственно за элементом head.

<html> 
<head> 
<title>Здесь размещаеться подходящий текст заголовка</title> 
</head> 
<body> 
</body> 
</html>
При просмотре страницы в браузере информация, размещенная внутри элемента body, отображаеться в окне браузера.

Комментарии языка HTML
Еще одной важной составляющей разменти языка html, являються комментарии. Комментарии позволяют временно скрыть содержимое или разметку, оформить содержимое элементов особым образом для обратной совместимости, обозначить части внутри документов и создать пояснения для других людей, которые, возможно, будут работать над страницей.

Синтаксис комментария языка html выглядит следующим образом:

<!-- -->

Все что необходимо скрыть, обозначить или представить в виде руководства, размещаеться между открывающейся и закрывающейся частью комментария.
Пример:
<body> 
<!-- 
<p>Это содержимое видно не будет, посколько оно заключено в комментариях</p> 
--> 
<p>Это содержимое видно будет, поскольку оно находиться за пределами поля комментария</p> 
</body>

Можно отмечать разделы документа

<body> 

<!-- Начало основного содержимого --> 

<!-- Конец основного содержимого --> 

</body>

Комментарии удобно использовать для указаний.

Добавил: (Irina) Рейтинг: 0.0/0
HTML. title
Подробнее о элементе title

Элемент title являеться единственным обязательным элементом раздела head. В строке заголовка браузера отображаеться любой текст, содержащийся в этом элементе, вместе с названием браузера, которое добавляется в конец текста.

Помимо того, что элемент title всегда должен присутствовать в документе, создание хорошего заголовка является первоочередной задачей, преследующей три цели:
Указание заголовка страницы;
предостовление ориентировки пользователям - то есть предоставление пользователям о том, где они находяться в интернете и на самом сайте.
Предоставление дополнительной информации о странице сайта.

Создание эффективного заголовка подразумевает выполнения этих трех положений.

Вот пример эффективного заголовка:
Форум Ucoz - Вопросы по сервисам - Общие вопросы - Основы HTML

<title> Форум Ucoz - Вопросы по сервисам - Общие вопросы - Основы HTML </title>

Ну как бы завершая основную часть, вот как все вместе должно выглядеть
<html> 
<head> 

<title>Сайт : расположение на сайте : заголовок темы</title> 

<meta name="author" content="тут ваше имя"> 

</head> 

<body> 

<!-- Область основного содержимого --> 

</body> 
</html>

Сайт : расположение на сайте : заголовок темы



Добавил: (Irina) Рейтинг: 0.0/0
HTML. О тексте
Правильное использование заголовков

Заголовки в языках HTML & XHTML представляют собой теги. Существуют теги 6 уровней заголовков, начиная с

<h1>....</h1> и заканчивая <h6>....</h6>

Заголовок считают самым важным, а h2 подзаголовком и тд.
Пример добавления заголовка

<h1>Ucoz Web-Services</h1> 
<h2>Новый взгляд на создание сайтов</h2>

Добавление абзацев

Управление абзацами выполняеться при помощи элемента абзаца, <p></p> <p>Система управления сайтом 
Уникальная система управления сайтом, позволяющая создать как статический, так и динамический сайт.</p> 

<p>Новое поколение веб-сервисов. Наконец-то создание сайта стало простой и увлекательной процедурой...</p>

Тег разрыв строки
Этот тег применяеться для разрыва строк абзаца. Он полезен для оформления, например текста стихотворения. В языке XHTML этот тег обозначаеться так <br />
<p>Мой дядя самых честных правил<br /> 
  Когда не в шутку занемог,<br /> 
  Он уважать себя заставил<br /> 
  И лучше выдумать не мог</p>

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

Для создания упорядоченного списка необходимо два элемента.
<ol></ol> - (ordered list - упорядоченный список) 

<li></li> - (list item - элемент списка)

Пример:

<ol> 
<li>Зарегистрируйтесь в системе UCOZ</> 
<li>Тщательно разберитесь с системой</li> 
<li>Создайте свой сайт</li> 
</ol>

Неупорядоченный список
Ну это где поряд размещения не важен. В основном такие списки называют маркированные. Структура почти такая же, только вместо элемента <ol></ol> используем элемент <ul></ul>

<p>Список сервисов в системе UCOZ</p> 
<ul> 
<li>Редактор сайта</li> 
<li>Гостевая книга</li> 
<li>Форум</li> 
<li>Каталог статей</li> 
<li>Дневник (блог)</li> 
<li>Фотоальбомы</li> 
<li>Новости сайта</li> 
<li>Каталог файлов</li> 
<li>FAQ (вопрос/ответ)</li> 
<li>Опросы</li> 
<li>Почтовые формы</li> 
</ul>


Добавил: (Irina) Рейтинг: 0.0/0
Форма входа

Мини-чат
200

Друзья сайта

Статистика

Онлайн всего: 1
Гостей: 1
Пользователей: 0

IP-18.218.55.14


Статистика посещаемости, мониторинг доступности сайта Пожелания, поздравления и тосты Rambler's Top100 Goon Каталог сайтов Петербург Петербург тест скорости интернета

В гостях у IRINA © 2024