Чистка: (25.07.11) Основы HTML - Страница 2

Страница 2 из 2
«
1
2

Архив - только для чтения

Чистка: (25.07.11) Основы HTML (То что должен знать каждый)

Чистка: (25.07.11) Основы HTML

Daniil90

Сообщений: 2

Репутация: 7

Сообщение # 16 | 22:48:16 06 Июн 2006

Решил вам помочь!!!
Щас я напишу не много!
Форматирование символов:

Элемент <EM>

Элемент <EM> используется с целью выделения особым шрифтом слова или текста.
Синтаксис: <EM> Текст </EM>
Пример: Текст выделенный тэгами <EM> и </EM>
Элемент <CODE>

Элемент <CODE> используется с целью дополнительного выделения фрагментов программного кода. По умолчанию он отображается телетайпным шрифтом. Данный элемент предпочтительнее, чем элемент <TT> (телетайпный шрифт). Поскольку расположение пробелов существенно для чтения программного кода, элемент <CODE> целесообразно употреблять в сочетании с элементом <PRE>.
Синтаксис: <CODE> листинг кода </CODE>
Пример: Текст выделенный тэгами <CODE> и </CODE>
Элемент <KBD>

Элемент <KBD> используется с целью выделения диалога пользователя с компьютером .
Синтаксис: <KBD> Ввод с клавиатуры </KBD>
Пример: Текст выделенный тэгами <KBD> и </KBD>
Элемент <VAR>

Элемент <VAR> используется с целью дополнительного выделения переменных в коде совместно с элементом <CODE> .
Синтаксис: <VAR> Переменная </VAR>
Пример: Текст выделенный тэгами <VAR> и </VAR>
Элемент <SAMP>

Элемент <SAMP> используется с целью выделения диалога пользователя с компьютером .
Синтаксис: <SAMP> Системное сообщение компьютера </SAMP>
Пример: Текст выделенный тэгами <SAMP> и </SAMP>
Элемент <DFN>

Элемент <DFN> используется с целью обозначения терминов и определений по типу словарей или глоссариев.
Синтаксис: <DFN> Текст </DFN>
Пример: Текст выделенный тэгами <DFN> и </DFN>
Элемент <CITE>

Элемент <CITE> используется с целью обозначения источника информации ,из которого взята цитата.
Синтаксис: <CITE> Текст </CITE>
Пример: Текст выделенный тэгами <CITE> и </CITE>
Элемент <STRONG>

Элемент <STRONG> используется с целью выделения особым шрифтом слова или текста.
Синтаксис: <STRONG> Текст </STRONG>
Пример: Текст выделенный тэгами <STRONG> и </STRONG>
Элемент <I>

Элемент <I> используется с целью выделения особым шрифтом слова или текста.
Синтаксис: <I> Текст </I>
Пример: Текст выделенный тэгами <I> и </I>
Элемент <B>

Элемент <B> используется с целью выделения особым шрифтом слова или текста.
Синтаксис: <B> Текст </B>
Пример: Текст выделенный тэгами <B> и </B>
Элемент <U>

Элемент <U> используется с целью выделения особым шрифтом слова или текста.
Синтаксис: <U> Текст </U>
Пример: Текст выделенный тэгами <U> и </U>
Элемент <STRIKE>

Элемент <STRIKE> используется с целью выделения особым шрифтом слова или текста.
Синтаксис: <STRIKE> Текст </STRIKE>
Пример: Текст выделенный тэгами <STRIKE> и </STRIKE>
Элемент <TT>

Элемент <TT> используется с целью выделения особым телетайпным шрифтом слова или текста.
Синтаксис: <TT> Текст </TT>
Пример: Текст выделенный тэгами <TT> и </TT>
Элемент <SUP>

Элемент <SUP> используется с целью выделения особым шрифтом слова или текста.
Синтаксис: <SUP> Текст </SUP>
Пример: Текст выделенный тэгами <SUP> и </SUP>
Элемент <SUB>

Элемент <SUB> используется с целью выделения особым шрифтом слова или текста.
Синтаксис: <SUB> Текст </SUB>
Пример: Текст выделенный тэгами <SUB> и </SUB>
Элемент <BIG>

Элемент <BIG> используется с целью выделения особым шрифтом слова или текста относительно основного текста.
Синтаксис: <BIG> Текст </BIG>
Пример: <span class=cod>Текст <BIG> выделенный тэгами </big> <BIG> и </BIG>
Элемент <SMALL>

Элемент <SMALL> используется с целью выделения особым шрифтом слова или текста относительно основного текста.
Синтаксис: <SMALL> Текст </SMALL>
Пример: Текст выделенный тэгами <SMALL> и </SMALL>
Элемент <BLINK>

Элемент <BLINK> используется с целью выделения особым шрифтом слова или текста относительно основного текста.
Синтаксис: <BLINK> Текст </BLINK>
Пример: Текст выделенный тэгами <BLINK> и </BLINK>
Элемент <FONT>

Элемент <FONT> используется с целью выделения особым шрифтом слова или текста. С ним применяются два атрибута size и color. Некоторые браузеры поддерживают атрибут face, позволяющий задать любой из перечня шрифтов, если браузер не находит заданный шрифт - то используется шрифт, заданный по умолчанию.
Синтаксис: <FONT size=n color="цвет"> Текст </FONT>

или <FONT face=имя color="цвет"> Текст </FONT>
Элемент <BASEFONT>

Элемент <BASEFONT> используется как альтернатива атрибуту size элемента <FONT>, он позволяет задать базовый размер шрифта во всем документе и не имеет конечного тега. По умолчанию значение его задается равным 3 ,значение size может выражаться так же и относительным размером, например, размер -1 означает размер на один меньший, чем по умолчанию.
Синтаксис: <BASEFONT size=n>
Элемент <ABBR>

Элемент <ABBR> используется с целью логического выделения слова, обозначающего аббревиатуру, например ФСБ, FBI , HTML , WWW, MTV
Синтаксис: <ABBR>ФСБ</ABBR>
Элемент <ACRONYM>

Элемент <ACRONYM> используется с целью логического выделения слова, обозначающего акроним, например GmBH, Ltd., и т.д., и т.п.,
Синтаксис: <ACRONYM>Ltd.</ACRONYM>
Элемент <INS>

Элемент <INS> используется с целью выделения особым шрифтом слова или текста, когда требуется показать явно, что текст был вставлен после опубликования документа.
Синтаксис: <INS>текст</INS>
Пример: Текст выделенный тэгами <INS> и </INS>
Элемент <DEL>

Элемент <DEL> используется с целью выделения особым шрифтом слова или текста, когда требуется показать явно, что текст был удален после опубликования документа.
Синтаксис: <DEL>текст</DEL>
Пример: Текст выделенный тэгами <DEL> и </DEL>
Элемент <Q>

Элемент <Q> используется с целью логического выделения краткой цитаты, встроенной в текст. Поддерживает атрибут lang и в зависимости от особенностей языка соответственно помечает цитату.
Синтаксис: <Q lang="ru">текст</Q>

Фу.... wink Устал. Есле надо ещё напишу!!!

Бокс+Самбо+Каратэ= Рукопашный бой (им я занимаюсь ;) :) )

Сообщение отредактировал Daniil90 - Вторник, 06 Июн 2006, 22:54:31

Daniil90

Сообщений: 2

Репутация: 7

Сообщение # 17 | 11:58:50 07 Июн 2006

Решил ещё чуть написать!
Структурное форматирование.

Комментарии <COMMENT >
Элемент позволяет скрыть от пользователя комментарии к исходному коду, а также для сокрытия сценариев Java Script от браузеров, которые не поддерживают их.
Синтаксис: <COMMENT> Текст комментария </COMMENT>
Полностью аналогичен старому варианту задания комментариев
Синтаксис: <!- - Текст комментария //- ->

Шесть уровней заголовков <Hn>
Соответствующие каждому уровню гарнитура и размер шрифта зависят от браузера, стилю <H1> назначается самый большой и самый жирный шрифт, а стилю <H6> назначается самый маленький и самый невзрачный шрифт. Элемент может иметь атрибут align, который указывает отступ left, center или right.
Синтаксис: <Hn align=отступ> Текст заголовка </Hn>

Разделительные линии <HR>
Элемент <HR> используется для проведения горизонтальной черты в документе, он может иметь атрибуты : color, задающий цвет линии, size высота в пикселах width ширина в пикселях или процентах от ширины экрана, align режим выравнивания, и не имеет конечного тега.
Синтаксис: <HR align="center" size=n width=n color="цвет">

Элемент <P>
Этот элемент задает один из способов разбиения текста на абзацы. Он может иметь вложенный атрибут align, который указывает отступ left, center или right. Каждый следующий абзац игнорирует, заданное для предыдущего абзаца значение align.
Синтаксис: <P align=отступ> Текст абзаца </P>

Элемент <BR>
Этот элемент задает разрыв текста с переходом на новую строку. Он может иметь вложенный атрибут clear, который может принимать значения left, all или right тем самым указывать обтекание текста вокруг плавающих изображений, вставленных в текст нестандартным способом. Каждый следующий абзац игнорирует, заданное для предыдущего абзаца значение clear.
Синтаксис: <BR clear=обтекание> Текст
Может быть отменен тэгами <NOBR> и </NOBR>

Элемент <WBR>
Этот элемент задает разрыв текста в данном месте при необходимости с переходом на новую строку.
Синтаксис: <WBR >Текст

Элемент <PRE>
Весь текст, заключенный в тэги <PRE> и </PRE> будет визуализирован браузером точно так, как он визуализирован в исходном коде документа, кроме того, текст выводится моноширинным шрифтом, что значительно упрощает задачу форматирования текста в колонки. Элемент поддерживается не всеми браузерами, он может иметь атрибут width, который задает ширину отводимого пространства под текст в символах. Элемент сменил собой устаревшие элементы <XMP>, <LISTING> и <PLAINTEXT>
Синтаксис: <PRE width=число символов >...текст.. .</PRE>

Элемент <DIV>
Элемент <DIV> позволяет выделить в структуре документа несколько разделов. Он является блочным элементом, функционирующим во многом подобно элементу <P>. Если закрывающий тэг </P> опущен, то <DIV> эффективно заменяет его и начинает новый абзац. Он может иметь атрибут align, который указывает отступ left, center или right. Каждый следующий раздел игнорирует, заданное для предыдущего раздела, значение align.
Синтаксис: <DIV align=отступ> Текст раздела </DIV>

Элемент <CENTER>
Элемент <CENTER> текст </CENTER> полностью идентичен конструкции
Синтаксис: <DIV align=center> Текст раздела </DIV>

Элемент <ADDRESS>
Элемент <ADDRESS> используется для оформления контактной информации текущего документа, будь то адрес электронной почты или полный почтовый адрес с номером телефона.
Синтаксис: < ADDRESS>контактная информация </ADDRESS>

Элемент <BLOCKQUOTE>
Элемент <BLOCKQUOTE> позволяет выделить обьемный текст-цитату из общего текста.
Синтаксис: <BLOCKQUOTE> Текст </BLOCKQUOTE>

Элемент <SPAN>

Элемент <SPAN> позволяет выделить некоторое количество текста для последующего его форматирования, но в отличие от <DIV> не начинает новый абзац.
Синтаксис: <SPAN> Текст </SPAN>

Потом может ещё напишу! biggrin

Бокс+Самбо+Каратэ= Рукопашный бой (им я занимаюсь ;) :) )

Piterski

Сообщений: 386

Репутация: 195

Сообщение # 18 | 14:20:04 10 Июл 2006

Элемент TABLE

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

Code

Ширина таблицы

Ширину таблицы можно задать двумя способам: в пикселях и в процентах.
Значение выраженное в пикселях считается фиксированным, поскольку ширина таблицы всегда будет соответствовать этому значению.

Code

[ Пример таблицы с фиксированной шириной ]

Значение выраженное в процентах, считаеться динамическим значением, поскольку таблица будет занимать пространство, выраженное в процентах относительно свободного пространства окна браузера.

Code

[ Пример таблицы с динамической шириной ]

Границы таблицы и интервалы

Язык HTML позволяет включить отображение границ таблиц

Code

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

Для добавления интервала между ячейками используеться атрибут cellspacing.
Для добавления интервала между содержимым ячейки и самой ячейкой используеться атрибут cellpadding:

Code

[ ример таблицы с динамическим значением ширины в 90% , и использование атрибутов border cellspacing cellpadding ]

Добавление строк таблицы

Строка в таблице добавляется с помощью элемента tr

Code

<table width="90%" border="1" cellspacing="10" cellpadding="10">
<tr>
Данные
</tr>
</table>

Таблица может содержать любое необходимое колличество строк.

Добавление ячеек таблицы

Ячейкуи формируют вертикальные столбцы, используя теги <td></td>
Элементы table tr и td являються тремя неотъемлемыми состовляющими любой таблицы

Code

<table width="90%" border="1" cellspacing="10" cellpadding="10">
<tr>
<td>Данные</td>
<td>Данные</td>
<td>Данные</td>
</tr>
</table>

[ Пример простой таблицы: три ячейки, одна строка, ширина 90%, интервал 5 ]

Пойду пообедаю, потом продолжу.

Piterski

Сообщений: 386

Репутация: 195

Сообщение # 19 | 15:46:48 11 Июл 2006

Извиняйте. Интернет тормозил. Продолжим про таблицы...

Добавление заголовков таблиц

Заголовок таблицы обозначает заголовок столбца или строки таблиы.

Code

Чтобы заголовки описывали столбцы, находящиеся под нимит, разместите все заголовки в одной строке, а затем добавьте столбцы, которые будут находиться под заголовками в последующих строках.

Code

<table width="90%" border="1" cellspacing="10" cellpadding="10">
<tr>
<th>Местоположение</th>
<th>Погода</th>
<th>Часовой пояс</th>
</tr>
<tr>
<td>Россия, Москва</td>
<td>Жаркая</td>
<td>День долгий</td>
</tr>
</table>

[ Посмотреть пример ]

Заголовки также можно использовать и для описания заголовков строк.

Code

<table width="90%" border="1" cellspacing="10" cellpadding="10">
<tr>
<th>Местоположение</th>
<td>Россия, Москва</td>
</tr>
<tr>
<th>Погода</th>
<td>Жаркая</td>
</tr>
<tr>
<th>Часовой пояс</th>
<td>День долгий</td>
</tr>
</table>

[ Посмотреть пример ]

Объединение строк

В процессе создание таблиц может понадобиться растянуть столбец на несколько строк, для этого существует атрибут rowspan, значение которого определяет количество строк.

Code

<table width="90%" border="1" cellspacing="10" cellpadding="10">
<tr>
<th rowspan="2">Заголовок (объдинены 2 строки)</th>
<td>Данные</td>
<td>Данные</td>
</tr>
<tr>
<td>Данные</td>
<td>Данные</td>
</tr>
<tr>
<th>Заголовок (слияния нет)</th>
<td>Данные</td>
<td>Данные</td>
</tr>
</table>

[ Посмотреть пример ]

Можно объединять строки и внутри ячеек.

Code

<table width="90%" border="1" cellspacing="10" cellpadding="10">
<tr>
<th rowspan="2">Заголовок (объдинены 2 строки)</th>
<td rowspan="3">Данные (объдинены 3 строки)</td>
<td>Данные</td>
</tr>
<tr>
<td>Данные</td>
</tr>
<tr>
<th>Заголовок (слияния нет)</th>
<td>Данные</td>
</tr>
</table>

[ Посмотреть пример ]

Объединение столбцов

Точно также как объединене строк можно объеденить столбцы.

Для этого используем атрибут colspan.

Code

<table width="90%" border="1" cellspacing="10" cellpadding="10">
<tr>
<th colspan="2">Заголовок (объдинены 2 строки)</th>
<th>Заголовок (объединения нет)</th>
</tr>
<tr>
<td>Данные</td>
<td>Данные</td>
<td>Данные</td>
</tr>
<tr>
<td>Данные</td>
<td>Данные</td>
<td>Данные</td>
</tr>
</table>

[ Посмотреть пример ]

Подобным образом можно объединять ячейки таблицы.

Code

<table width="90%" border="1" cellspacing="10" cellpadding="10">
<tr>
<th colspan="2">Заголовок (объдинены 2 столбца)</th>
<th>Заголовок (объединения нет)</th>
</tr>
<tr>
<td>Данные</td>
<td>Данные</td>
<td>Данные</td>
</tr>
<tr>
<td colspan="3">Заголовок (объдинены 3 столбца)</td>
</tr>
</table>

[ Посмотреть пример ]

Будте внимательны - различия между colspan и rowspan вас могут запутать. Помните, обьединенеи строк - это вертикальное объединение, объединение столбцов - горизонтальное объединение.

Piterski

Сообщений: 386

Репутация: 195

Сообщение # 20 | 12:26:11 05 Окт 2006

Элемент <IMG>

Используется для вставки в тело документа графического изображения. Под графическим изображением подразумевают: маленькие пиктограммы, рисунки, графические объекты и карты изображений, занимающие большую часть окна браузера. Кроме того, элемент <IMG> поддерживает различные атрибуты.
Пример: <IMG src="URL" атрибуты>

src
Этот атрибут указывает на файл графики, задавая его URL.
Пример: <img src="http://ucoz.ru/img/image.jpg">
alt
В некоторых случаях, когда браузер не в состоянии загрузить файл с изображением, либо когда пользователь намеренно, с целью сэкономить время и деньги, отключает загрузку картинок, на экране высвечивается альтернативный текст типа здесь нарисован логотип фирмы .
Пример: <img src="http://ucoz.ru/img/image.jpg" alt="Тут нарисован логотип Ucoz">
width
Этот атрибут задает ширину области в пикселях, отводимой в окне под изображение.
Пример: <img src="http://ucoz.ru/img/image.jpg" alt="Тут нарисован логотип Ucoz" width="100">
height
Этот атрибут задает высоту области в пикселях, отводимой в окне под изображение
Пример: <img src="http://ucoz.ru/img/image.jpg" alt="Тут нарисован логотип Ucoz" width="100" height="50">

Чистка: (25.07.11) Основы HTML (То что должен знать каждый)

Страница 2 из 2
«
1
2