14 апреля 200918:43:50HTML 4 комментария

Что нужно для своего блога?

Во-первых, о блоге.
Как я уже говорил, для создания своего блога нужны знания html и php. Вы можете воспользоваться сторонними источниками, здесь же я напишу основное. Сразу хочу сказать, что здесь нет ничего сложного, а язык, который я буду описывать ниже, доступен каждому.
HTML. Что это такое? Это теговый язык разметки документов или, проще сказать, команды для разметки страницы. Он представляет собой набор элементов, причём начало и конец каждого элемента обозначается специальными пометками — тегами. Что-то вроде такого:

<тег>какой-то текст внутри тега</тег>

Пример тегов:

<b>этот текст в документе html жирный</b>

<i>Этот текст в документе html курсив</i>

<u>Этот текст в документе html подчеркнутый</u>

Достаточно лишь выучить все эти теги и вы сможете уже сделать свой простой сайт. Попробуйте сейчас открыть блокнот, скопировать туда один из моих примеров и сохранить в формате html. Далее открывайте свой сохраненный документ в браузере. Получилось? Вот список главных тегов:

a
Тег “a” является одним из важных элементов HTML и предназначен для создания ссылок. Этот тег устанавливает ссылку на другой документ и требует закрытия.
Пример:
<a href="http://ссылка.html">Текст ссылки</a>

b
Здесь всё просто. Текст внутри этого тега становится жирным. Этот тег в последнее время редко используется, его вытесняет аналогичный тег “strong”.

Пример:
<b>Жирный текст</b>

br
Тег br устанавливает перевод строки в месте, где этот тег встречается. Закрытия не требует.

Пример:
Вот текст на одной строке <br /> а вот текст уже на следующей строке

del
Тег del- это зачеркнутый текст.

Пример:
<del>Этот текст будет в html зачеркнутым</del>

dfn
Текс внутри тега выглядит как курсив, но используется для выделения терминов при их первом появлении.

Пример:
<dfn>Термин курсивом</dfn>

div
Тег div является блочным элементом и предназначен для выделения фрагмента документа с целью изменения вида содержимого. Для использования этого тега потребуются знания css, поэтому о нём позднее.

Пример:
<div>Блочный элемент</div>

em
Еще один тег для отображения текста курсивом. Предназначен для акцентирования текста. В последнее время также, как и в ситуации с тегом “b”, вытесняет тег “i”.

Пример:
<em>Для курсива лучше всего использовать этот тег</em>

font
Тег для редактирования параметров шрифта. Имеет много параметров, главные из них: face- сам шрифт, size- размер, color- цвет. Вместо тега font лучше использовать css, о котором я говорил здесь.

Пример:
<font face="Arial">Текст шрифтом Arial</font>
<font size="14">Текст размером 14</font>
<font color="red">Текст красным цветом</font>
<font face="Arial" size="14" color="red">Всё вместе</font>

form
Тег устанавливает форму на сайт. Имеет множество атрибутов и тегов, которые располагаются между “form”. Для использования нужны знания php или javascript.

Пример:
<form>Для этого тега кишка тонка :)</form>

h1, h2, h3, h4, h5, h6
Эти теги используют для написания заголовков и для поисковиков. Они очень любят индексировать информацию внутри этих тегов. Тег “h1″- самый важный заголовок или заголовок первого уровня, а “h6″- самый незначительный из 6 предусмотренных заголовков.

Пример:
<h1>Заголовок первого уровня</h1>
<h2>Заголовок второго уровня</h2>
<h3>Заголовок третьего уровня</h3>

html
Этим тегом начинается и заканчивается html-документ.

Пример:
<html>Содержимое документа</html>

i
Текст внутри тега отображается курсивом. Этот тег устаревает, лучше использовать “em”.

Пример:
<i>Текст курсивом</i>
<em>>Но лучше использовать этот тег</em>

img
Тег вставляет в html-документ изображение.

Пример:
<img src="путь к изображению.jpg">

ins
Текст внутри этого тега становится подчеркнутым. Рекомендуется использовать его, а не “u”.

Пример:
<ins>Подчеркнутый текст</ins>

li
Тег служит для создания элемента списка. Сам список создается с помощью тегов “ol” и “ul”. Первый создает нумерованный список, второй маркированный.

Пример:
<ol>
   <li>Первый элемент нумерованного списка</li>
   <li>Второй элемент нумерованного списка</li>
</ol>
<ul>
   <li>Первый элемент маркерованного списка</li>
   <li>Второй элемент маркерованного списка</li>
</ul>

nobr
Внутри этого тега текст отображается без переносов.

Пример:
<nobr>Этот текст не будет переноситься на новую строку</nobr>

p
Тег абзаца. Абзац в html- это не красная строка, а пропущенная строка. То есть текст начинается не с новой красной строки, а начинается через строку с её начала.

Пример:
Выглядит примерно так:
 
<p>Вот один абзац</p>
 
<p>А вот другой</p>

small
Внутри этого тега размер шрифта будет меньше на единицу по сравнению со шрифтом по умолчанию.

Пример:
<small>Шрифт размером на единицу меньше</small>

strong
Аналог тега b. Предназначен для акцентирования текста, текст внутри тега отображается жирным.

Пример:
<strong>Жирный текст</strong>

style
Тег для использования css и применения стилей для элементов html-документа. Подробнее здесь.

Пример:
<style>css стили</style>

table
Тег “table” служит для создания таблицы. Внутри тега используются теги “tr” и “td” для создания строк и ячеек.

Пример:
<table>
   <tr>
      <td>Первая строка, первый столбец</td>
      <td>Первая строка, второй столбец</td>
   </tr>
   <tr>
       <td>Вторая строка, первый столбец</td>
       <td>Вторая строка, второй столбец</td>
    </tr>
</table>

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

Пример:
<title>Название моего сайта</title>

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

Ссылки:

Если вы дочитали до конца, значит вы заинтересованы в обучении html. Так вот что я вам скажу- не надо сидеть тарабанить весь этот текст Вы прочитали, узнали что такое теги и как они выглядят. Этого и требовалось- теперь когда мы будем работать с движком wordpress для вас не будет шоком страница, заполненная тегами (не факт! ), а остальное на практике приложится
Здесь нет ничего сложного и невозможного. Помните, что как только вам в голову пришла мысль, что ничего не выйдет- считайте что всё- для вас действительно уже ничего не выйдет. У вас всё получится, немножко терпения
———
Оборудуйте свой офис по последнему слову моды и удобства-офисная мебель в Краснодаре а так же самых различных назначений: от мебели для общепита до мебели для складов.

(Нет голосов)

Понравилась статья? Подпишись, чтобы не пропустить другие

Другие записи

guece 01.05.2009 21:31 [цитировать]

Да, жаль, что обновления на блоге происходят не так часто, как хотелось бы.
admin 11.07.2009 16:06 [цитировать]

Да, жаль, что спамеры приходят на блог так часто, как не хотелось бы.
Ирина 28.05.2010 16:24 [цитировать]

Здравствуйте! Подскажите, пожалуйста, пишу пост, выделяю некоторые слова жирным, курсором (B, Strong) … в тексте на редактировании выделения видны, но после публикации на сайте выходит просто текст без «выделений» … как это можно исправить? В исходном коде страницы тэги форматирования присутствуют… :/ Буду очень благодарна за совет. Спасибо! (Версия 2.9.2)
Ирина 31.05.2010 15:33 [цитировать]

Ошибка была в CSS, там не был прописан тег strong, поставила в конец CSS файла такой код: strong {font-weight:bold!important} и всё стало выделять жирным. код em {font-style: italic;} получается просто курсив, а если strong {font-style: italic;} то курсив будет жирный…