-= сам сделай сайт! =-

Руководство по Html.

Инструментарий. Основные понятия.

  • Ступенька 1 - "Основной инструментарий, учимся работать руками".
  • Ступенька 2 - "Хтмл - язык ли? Гуси, гуси , тэги, tag`и".
  • Ступенька 3 - "Обязательные тэги. Зачем телу голова, а голове тело?"

  • Простейшие.
    Ступенька 4 - "Раскрась сам. Изменяем цвет текста".
  • Ступенька 5 - "Как изменять цвет фона. Оранжевый галстук".
  • Ступенька 6 - "Параграфы. Учимся выравнивать текст".
  • Ступенька 7 - "Что такое заголовки и как задавать размер буковок".
  • Ступенька 8 - "Курсив, жирный текст, подчеркнутый и другие".
  • Ступенька 9 - "Что такое путь?" Как вставлять картинки".
  • Ступенька 10 - "Что можно сделать с картинкой".
  • Ступенька 11 - "Ссылка и как с нею бороться".
  • Ступенька 12 - "Может ли картинка быть ссылкой".
  • Ступенька 13 - "Куда податься, на что ссылаться. Новое окно".
  • Ступенька 14 - "Что такое списки, или Он меня посчитал".
  • Ступенька 15 - "О линиях. Просто и полезно".
  • Ступенька 16 - "Спецсимволы или Головная боль".

    Таблицы.
  • Ступенька 17 - "Учимся создавать таблицы".
  • Ступенька 18 - "Учимся создавать таблицы" продолжение.
  • Ступенька 19 - "Таблицы, вертикальное выравнивание (valign)".
  • Ступенька 20 - "Таблицы, учимся растягивать ячейки (rowspan, colspan)"
  • Ступенька 21 - "Таблицы, что такое cellspacing и cellpadding. Что делать с пространством".
  • Ступенька 22 - "Вложенные таблицы и некоторые нюансы".
  • Ступенька 23 - "О рамках таблиц, и брюзжание о таблицах напоследок".

    Фреймы.
  • Ступенька 24 - "Вступление. Зачем они (фреймы) нужны."
  • Ступенька 25 - "Учимся создавать фреймы".
  • Ступенька 26 - "Учимся создавать фреймы" продолжение.
  • Ступенька 27 - "Учимся создавать фреймы" продолжение.
  • Ступенька 28 - "Параметры тэга Frame. Убираем полосу прокрутки, избавляемся от рамок, регулируем ширину полей фрейма".
  • Ступенька 29 - "Как делать так, чтобы при нажатии на ссылку документ открывался в другом фрейме, в полное окно".
  • Ступенька 30 - "Последняя глава о фреймах. Что такое IFrame. Несколько ссылок напоследок.".

    Дополнительные.
  • Ступенька 31 - "Форматирование текста. Тэги Big, Small, Strike (или S), Sub и Sup" (крупный, малый текст, перечеркнутый, верхний и нижний индексы).
  • Ступенька 32 - Завершение обтекания текстом объекта (картинки).
  • Ступенька 33 - Навигационные карты. Map. Как сделать часть картинки ссылкой.
  • Ступенька 34 - Навигационные карты 2.
  • Ступенька 35 - Навигационные карты 3.
  • Ступенька 36 - Ссылка внутри документа, якоря, anchor.
  • Ступенька 37 - Как убрать отступы (поля) документа, topmargin, leftmargin, marginwidth, marginheight.
  • Ступенька 38 - Cпецифические теги, бегущая строка текста.

    Примечания.
  • Примечание (1) - Как сохранить документ, как html-файл в блокноте.
  • Примечание (2) - Несколько ссылок на тему "История HTML".
  • Примечание (8) - Работа со шрифтами (ссылки).
  • Примечание (11) - Подсказка к текстовой ссылке
  • Примечание (11) - Дополнительные опции Mailto.
  • Примечание (12) - Как задавать цвет рамок вокруг картинки? И нужны ли рамки?
  • Примечание (24) - "Фреймы хорошо, или все же плохо?"

    Карта сайта
    Всё о PHP | .

  •  
     

    Главная | Оглавление | Словарь

    В этой главе мы научимся выделять текст при помощи заголовков и узнаем еще одну функцию тэга <font></font>.

    Итак, мы уже немного умеем форматировать текст, но посмотрите на наш документ. Мне кажется, что фраза "Здравствуйте, это моя первая страница" так и просится, чтобы ее выделили. Для этого можно использовать заголовки:

    <H1> текст </H1>

    <H2> текст </H2>

    <H3> текст </H3>

    <H4> текст </H4>

    <H5> текст </H5>
    <H6> текст </H6>

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

    В пример я ввела заголовок третьего уровня <H3></H3> (мой любимый размер:). Смотрите, что получилось.

    <html>
    <head>
    <title>Мой первый шаг </title>
    </head>
    <body text="#336699" bgcolor="#000000">
    <center>
    <H3>Здравствуйте, это моя первая страница.</H3>
    <br>
    <font color="#CC0000"> Добро пожаловать!</font> :) </center>
    <p align="justify">
    Я совсем недавно начал(а) знакомиться с виртуальной жизнью, но мне по давней традиции тоже захотелось создать свою домашнюю страничку для моих новых виртуальных друзей и знакомых, чтобы они могли посмотреть мои фотографии, почитать обо мне, черкнуть пару строчек в мою гостевую книгу. А может и просто случайный посетитель вдруг захочет познакомится со мной, и у меня появится еще один виртуальный друг? :)
    </p>
    </body>
    </html> (прим.)



    Заголовки предназначены для выделения небольшой части текста (строки, фразы), НО, если вы хотите выделить большой фрагмент текста, или только одно слово, при этом без переноса строки, то как быть? С заголовками такое не пройдет, поэтому вспомним о тэге <font></font>:
    <font size="+4"> текст </font>
    <font size="+3"> текст </font>
    <font size="+2"> текст </font>
    <font size="+1"> текст </font>
    <font size="+0"> текст </font>
    <font size="-1"> текст </font>
    <font size="-2"> текст </font>

    Опять пришлось пожертвовать красотой:) Итак, параметр size задает размер шрифта, но, в отличие от заголовков, текст не выделяется жирным шрифтом (о курсиве, жирном шрифте и т.п поговорим позже) и нет принудительного переноса.

    <html>
    <head>
    <title>Мой первый шаг </title>
    </head>
    <body text="#336699" bgcolor="#000000">
    <center>
    <H3>Здравствуйте, это моя первая страница.</H3>
    <br>
    <font color="#CC0000"> Добро пожаловать!</font> :) </center>
    <p align="justify">
    Я совсем недавно начал(а) знакомиться с виртуальной жизнью, но мне по давней традиции тоже захотелось создать свою домашнюю страничку для моих новых виртуальных друзей и знакомых, чтобы они могли посмотреть мои фотографии, почитать обо мне, черкнуть пару строчек в мою гостевую книгу. А может и просто случайный посетитель вдруг захочет познакомится со мной, и у меня появится <font size="+1"> еще один виртуальный друг? :)</font>
    </p>
    </body>
    </html> (прим.)


    В нашем примере я выделила слова "еще один виртуальный друг?", пусть все думают, что вы горите желанием завести еще одного виртуального друга:)

    Прежде, чем мы двинемся дальше, хочу предупредить, что есть такая опасная болезнь у дизайнеров, как гигантомания. Ее симптомы: непомерно большие размеры шрифта, гигантские кнопища на пол экрана, вместо маленьких и милых кнопочек, и толстый (жирный) во всех случаях текст. Поэтому напоминаю: стандартный size (по умолчанию) ="+0".

    Фух:) топаем дальше.

    Назад | Шагнуть на следующую ступеньку


    « (12.18) unheard: орг
    (12.18) Апо: я знаю
    (12.18) unheard: но про паспорт не я
    (12.18) Апо: а уних
    (12.18) Апо: уже
    (12.18) unheard: придумывал)
    (12.18) Апо: фифа
    (12.18) Апо: стоит
    (12.18) Апо: там
    (12.18) unheard: нет ставитьпаеду
    ...»


    источник тут
    |

    « [12:15] Zulfiqor: San suradinu
    [12:15] Dimr: leyla17 salom
    [12:15] _goldboy: Salom leyla tanimadina
    [12:15] Elmus: LaZiZCHiK95, ну наверна так
    [12:15] LaZiZCHiK95: Toshkenli_girl ee radio kaptarxoma
    [12:15] LaZiZCHiK95: Kaptarxona
    [12:15] LaZiZCHiK95: Toshkenli_girl )
    ...»


    дальше там

    Hosted by uCoz