HTML (часть 2)
несколько ступенек будут посвящены именно этим тэгам: мы узнаем как менять цвет текста, фона, как делать текст крупнее-мельче, поговорим о картинках, таблицах и многом другом:)
На этой ступеньке мы будем учиться раскрашивать:) Для начала нам нужна будет палитра (все цвета интернета - не забудьте прочитать там инструкцию, а затем продолжим обучение). Сохраните палитру у себя на диске, она вам еще не раз пригодится:)
Зачем все это? А затем, что все цвета прописываются именно таким способом.
Например белый цвет - ffffff
Но вернемся к нашей страничке. Давайте окрасим слова Добро Пожаловать в красный.
<font color="#CC0000">Добро пожаловать! :)</font>
Теперь попробуйте вместо СС0000 поподставлять другие значения цветов.
<html>
<head>
<title>Мой первый шаг </title>
</head>
<body>
Здравствуйте, это моя первая страница.
<br>
<font color="#CC0000"> Добро пожаловать! :) </font>
</body>
</html> (прим.)
Тэг <font></font> - многофункционален. Им может задаваться не только цвет текста в конкретной части документа, но и размер шрифта, и вид шрифта (Arial), но об этом чуть позже.
Как же еще задавать цвета в документе? - вспомним об открывающем теге <body>:
<body text="#336699">
Это значит, что весь текст страницы будет синим, кроме текста, для которого мы специально прописали <font></font> (если цвет в <body> не задавать, то по умолчанию он будет черным).
<html>
<head>
<title>Мой первый шаг </title>
</head>
<body text="#336699">
Здравствуйте, это моя первая страница.
<br>
<font color="#CC0000"> Добро пожаловать!</font> :)
</body>
</html> (прим.)
Со цветами для текста мы разобрались, теперь подумаем о фоне. Шагайте дальше:)
На этой ступеньке мы узнаем, как изменять цвет фона документа, и поговорим немного об этике.
Цвет фона устанавливается в уже нам знакомом тэге <body>:
<body bgcolor="#000000">
Для наглядности я прописала черный цвет, вы же свой документ можете расскрасить любым другим (если цвет в <body> не указывать, то по умолчанию он будет белым, хотя иногда цветом по умолчанию может являться любой другой, кроме белого, поэтому лучше уж прописывайте цвет фона в body).
<html>
<head>
<title>Мой первый шаг </title>
</head>
<body text="#336699" bgcolor="#000000">
Здравствуйте, это моя первая страница.
<br>
<font color="#CC0000"> Добро пожаловать!</font> :)
</body>
</html> (прим.)
Обратите внимание: мы одновременно можем прописать в теге <body> и цвет текста в документе, и цвет фона (это на всякий случай, если вы еще не поняли:).
<body text="#336699 bgcolor="#000000">
С теоретической частью на данной ступеньке мы покончили, теперь присядем и немного поговорим о цветах. Нет, не о тех, которые растут в лесах, полях, оранжереях, а о цветах документа.
Я хочу попросить тебя, мой дорогой спутник, не злоупотреблять яркими фонами (желтым, красным, салатовым, ну, и черным с яркой смесью текста на нем). Почему? Да, просто пожалей глаза своих друзей, знакомых и случайного посетителя. Не следует также употреблять слишком много различных цветов на твоей странике, это, как и яркий фон, отвлекает от содержания, мешает прочтению и выставляет тебя самого в не лучшем свете.
Пример: Девочка в ярко-розовых джинсах и противном салатовом топике с надписью Kiss me, безусловно, привлечет внимание, но надолго ли? Не уподобляйтесь такой девочке:).
Кстати о внимании, давайте переключим его на следущую главу моего повествования и шагнем на другую ступеньку.
В этой главе мы поговорим о параграфах. Параграфы вводятся тэгом:
<p></p>
С помощью параграфов мы можем центрировать текст:
<p align="center">текст</p>
С помощью параграфов мы можем выровнять текст по левому краю:
<p align="left">текст</p>
Или по правому краю документа:
<p align="right">текст</p>
Теперь введем параграфы в наш документ и посмотрим наглядно, что получится (в наш пример я подставила параграф с параметром центрирования текста (center), попробуйте подставить в параграф другие параметры со значениями Left или Right).
<html>
<head>
<title>Мой первый шаг </title>
</head>
<body text="#336699" bgcolor="#000000">
<p align="center">
Здравствуйте, это моя первая страница.
<br>
<font color="#CC0000"> Добро пожаловать!</font> :) </p>
</body>
</html> (прим.)
Заметьте, что текст в документе, если не задавать параграфы, всегда выравнивается по умолчанию по левому краю. Также запомните, что к параграфу уже не нужен тэг <br> для переноса строки, т.к. перенос задается по умолчанию. Но что делать, если вам этот перенос никак не нужен? Есть тэг альтернативный <p align="center">:
<center>текст</center>
<html>
<head>
<title>Мой первый шаг </title>
</head>
<body text="#336699" bgcolor="#000000">
<center>
Здравствуйте, это моя первая страница.
<br>
<font color="#CC0000"> Добро пожаловать!</font> :) </center>
</body>
</html> (прим.)
Все было бы хорошо, и можно было бы шагнуть на следущую ступеньку, если бы у тэга <p> не существовало бы еще и четвертого, но опасного значения (атрибута):
<p align="justify">текст</p>
Это мой любимый атрибут параграфа, он выравнивает текст по обоим краям документа, и все становится милым и аккуратным. Почему же это опасный атрибут? Да не работает он в старых версиях броузеров, поэтому у тех, кто использует старые броузеры, он может не дейcтвовать (не отображаться), и вся красота-ляпота да аккуратность сойдет на нет (т.е. текст выровняется в таком случае по левому краю документа). Тем не менее я атрибутом justify злоупотребляю:)
<html>
<head>
<title>Мой первый шаг </title>
</head>
<body text="#336699" bgcolor="#000000">
<center>
Здравствуйте, это моя первая страница.
<br>
<font color="#CC0000"> Добро пожаловать!</font> :) </center>
<p align="justify">
Я совсем недавно начал(а) знакомиться с виртуальной жизнью, но мне по давней традиции тоже захотелось создать свою домашнюю страничку для моих новых виртуальных друзей и знакомых, чтобы они могли посмотреть мои фотографии, почитать обо мне, черкнуть пару строчек в мою гостевую книгу. А может и просто случайный посетитель вдруг захочет познакомится со мной, и у меня появться еще один виртуальный друг? :)
</p>
</body>
</html> (прим.)
Я тут за вас набросала примерный текст вступления (вы придумаете, конечно, что-нибудь свое). Теперь вставьте пример в наш документ и посмотрите за что я так люблю justify:)
Посмотрели? - Шагаем дальше.
В этой главе мы поговорим о параграфах. Параграфы вводятся тэгом:
<p></p>
С помощью параграфов мы можем центрировать текст:
<p align="center">текст</p>
С помощью параграфов мы можем выровнять текст по левому краю:
<p align="left">текст</p>
Или по правому краю документа:
<p align="right">текст</p>
Теперь введем параграфы в наш документ и посмотрим наглядно, что получится (в наш пример я подставила параграф с параметром центрирования текста (center), попробуйте подставить в параграф другие параметры со значениями Left или Right).
<html>
<head>
<title>Мой первый шаг </title>
</head>
<body text="#336699" bgcolor="#000000">
<p align="center">
Здравствуйте, это моя первая страница.
<br>
<font color="#CC0000"> Добро пожаловать!</font> :) </p>
</body>
</html> (прим.)
Заметьте, что текст в документе, если не задавать параграфы, всегда выравнивается по умолчанию по левому краю. Также запомните, что к параграфу уже не нужен тэг <br> для переноса строки, т.к. перенос задается по умолчанию. Но что делать, если вам этот перенос никак не нужен? Есть тэг альтернативный <p align="center">:
<center>текст</center>
<html>
<head>
<title>Мой первый шаг </title>
</head>
<body text="#336699" bgcolor="#000000">
<center>
Здравствуйте, это моя первая страница.
<br>
<font color="#CC0000"> Добро пожаловать!</font> :) </center>
</body>
</html> (прим.)
Все было бы хорошо, и можно было бы шагнуть на следущую ступеньку, если бы у тэга <p> не существовало бы еще и четвертого, но опасного значения (атрибута):
<p align="justify">текст</p>
Это мой любимый атрибут параграфа, он выравнивает текст по обоим краям документа, и все становится милым и аккуратным. Почему же это опасный атрибут? Да не работает он в старых версиях броузеров, поэтому у тех, кто использует старые броузеры, он может не дейcтвовать (не отображаться), и вся красота-ляпота да аккуратность сойдет на нет (т.е. текст выровняется в таком случае по левому краю документа). Тем не менее я атрибутом justify злоупотребляю:)
<html>
<head>
<title>Мой первый шаг </title>
</head>
<body text="#336699" bgcolor="#000000">
<center>
Здравствуйте, это моя первая страница.
<br>
<font color="#CC0000"> Добро пожаловать!</font> :) </center>
<p align="justify">
Я совсем недавно начал(а) знакомиться с виртуальной жизнью, но мне по давней традиции тоже захотелось создать свою домашнюю страничку
На этой ступеньке мы будем учиться раскрашивать:) Для начала нам нужна будет палитра (все цвета интернета - не забудьте прочитать там инструкцию, а затем продолжим обучение). Сохраните палитру у себя на диске, она вам еще не раз пригодится:)
Зачем все это? А затем, что все цвета прописываются именно таким способом.
Например белый цвет - ffffff
Но вернемся к нашей страничке. Давайте окрасим слова Добро Пожаловать в красный.
<font color="#CC0000">Добро пожаловать! :)</font>
Теперь попробуйте вместо СС0000 поподставлять другие значения цветов.
<html>
<head>
<title>Мой первый шаг </title>
</head>
<body>
Здравствуйте, это моя первая страница.
<br>
<font color="#CC0000"> Добро пожаловать! :) </font>
</body>
</html> (прим.)
Тэг <font></font> - многофункционален. Им может задаваться не только цвет текста в конкретной части документа, но и размер шрифта, и вид шрифта (Arial), но об этом чуть позже.
Как же еще задавать цвета в документе? - вспомним об открывающем теге <body>:
<body text="#336699">
Это значит, что весь текст страницы будет синим, кроме текста, для которого мы специально прописали <font></font> (если цвет в <body> не задавать, то по умолчанию он будет черным).
<html>
<head>
<title>Мой первый шаг </title>
</head>
<body text="#336699">
Здравствуйте, это моя первая страница.
<br>
<font color="#CC0000"> Добро пожаловать!</font> :)
</body>
</html> (прим.)
Со цветами для текста мы разобрались, теперь подумаем о фоне. Шагайте дальше:)
На этой ступеньке мы узнаем, как изменять цвет фона документа, и поговорим немного об этике.
Цвет фона устанавливается в уже нам знакомом тэге <body>:
<body bgcolor="#000000">
Для наглядности я прописала черный цвет, вы же свой документ можете расскрасить любым другим (если цвет в <body> не указывать, то по умолчанию он будет белым, хотя иногда цветом по умолчанию может являться любой другой, кроме белого, поэтому лучше уж прописывайте цвет фона в body).
<html>
<head>
<title>Мой первый шаг </title>
</head>
<body text="#336699" bgcolor="#000000">
Здравствуйте, это моя первая страница.
<br>
<font color="#CC0000"> Добро пожаловать!</font> :)
</body>
</html> (прим.)
Обратите внимание: мы одновременно можем прописать в теге <body> и цвет текста в документе, и цвет фона (это на всякий случай, если вы еще не поняли:).
<body text="#336699 bgcolor="#000000">
С теоретической частью на данной ступеньке мы покончили, теперь присядем и немного поговорим о цветах. Нет, не о тех, которые растут в лесах, полях, оранжереях, а о цветах документа.
Я хочу попросить тебя, мой дорогой спутник, не злоупотреблять яркими фонами (желтым, красным, салатовым, ну, и черным с яркой смесью текста на нем). Почему? Да, просто пожалей глаза своих друзей, знакомых и случайного посетителя. Не следует также употреблять слишком много различных цветов на твоей странике, это, как и яркий фон, отвлекает от содержания, мешает прочтению и выставляет тебя самого в не лучшем свете.
Пример: Девочка в ярко-розовых джинсах и противном салатовом топике с надписью Kiss me, безусловно, привлечет внимание, но надолго ли? Не уподобляйтесь такой девочке:).
Кстати о внимании, давайте переключим его на следущую главу моего повествования и шагнем на другую ступеньку.
В этой главе мы поговорим о параграфах. Параграфы вводятся тэгом:
<p></p>
С помощью параграфов мы можем центрировать текст:
<p align="center">текст</p>
С помощью параграфов мы можем выровнять текст по левому краю:
<p align="left">текст</p>
Или по правому краю документа:
<p align="right">текст</p>
Теперь введем параграфы в наш документ и посмотрим наглядно, что получится (в наш пример я подставила параграф с параметром центрирования текста (center), попробуйте подставить в параграф другие параметры со значениями Left или Right).
<html>
<head>
<title>Мой первый шаг </title>
</head>
<body text="#336699" bgcolor="#000000">
<p align="center">
Здравствуйте, это моя первая страница.
<br>
<font color="#CC0000"> Добро пожаловать!</font> :) </p>
</body>
</html> (прим.)
Заметьте, что текст в документе, если не задавать параграфы, всегда выравнивается по умолчанию по левому краю. Также запомните, что к параграфу уже не нужен тэг <br> для переноса строки, т.к. перенос задается по умолчанию. Но что делать, если вам этот перенос никак не нужен? Есть тэг альтернативный <p align="center">:
<center>текст</center>
<html>
<head>
<title>Мой первый шаг </title>
</head>
<body text="#336699" bgcolor="#000000">
<center>
Здравствуйте, это моя первая страница.
<br>
<font color="#CC0000"> Добро пожаловать!</font> :) </center>
</body>
</html> (прим.)
Все было бы хорошо, и можно было бы шагнуть на следущую ступеньку, если бы у тэга <p> не существовало бы еще и четвертого, но опасного значения (атрибута):
<p align="justify">текст</p>
Это мой любимый атрибут параграфа, он выравнивает текст по обоим краям документа, и все становится милым и аккуратным. Почему же это опасный атрибут? Да не работает он в старых версиях броузеров, поэтому у тех, кто использует старые броузеры, он может не дейcтвовать (не отображаться), и вся красота-ляпота да аккуратность сойдет на нет (т.е. текст выровняется в таком случае по левому краю документа). Тем не менее я атрибутом justify злоупотребляю:)
<html>
<head>
<title>Мой первый шаг </title>
</head>
<body text="#336699" bgcolor="#000000">
<center>
Здравствуйте, это моя первая страница.
<br>
<font color="#CC0000"> Добро пожаловать!</font> :) </center>
<p align="justify">
Я совсем недавно начал(а) знакомиться с виртуальной жизнью, но мне по давней традиции тоже захотелось создать свою домашнюю страничку для моих новых виртуальных друзей и знакомых, чтобы они могли посмотреть мои фотографии, почитать обо мне, черкнуть пару строчек в мою гостевую книгу. А может и просто случайный посетитель вдруг захочет познакомится со мной, и у меня появться еще один виртуальный друг? :)
</p>
</body>
</html> (прим.)
Я тут за вас набросала примерный текст вступления (вы придумаете, конечно, что-нибудь свое). Теперь вставьте пример в наш документ и посмотрите за что я так люблю justify:)
Посмотрели? - Шагаем дальше.
В этой главе мы поговорим о параграфах. Параграфы вводятся тэгом:
<p></p>
С помощью параграфов мы можем центрировать текст:
<p align="center">текст</p>
С помощью параграфов мы можем выровнять текст по левому краю:
<p align="left">текст</p>
Или по правому краю документа:
<p align="right">текст</p>
Теперь введем параграфы в наш документ и посмотрим наглядно, что получится (в наш пример я подставила параграф с параметром центрирования текста (center), попробуйте подставить в параграф другие параметры со значениями Left или Right).
<html>
<head>
<title>Мой первый шаг </title>
</head>
<body text="#336699" bgcolor="#000000">
<p align="center">
Здравствуйте, это моя первая страница.
<br>
<font color="#CC0000"> Добро пожаловать!</font> :) </p>
</body>
</html> (прим.)
Заметьте, что текст в документе, если не задавать параграфы, всегда выравнивается по умолчанию по левому краю. Также запомните, что к параграфу уже не нужен тэг <br> для переноса строки, т.к. перенос задается по умолчанию. Но что делать, если вам этот перенос никак не нужен? Есть тэг альтернативный <p align="center">:
<center>текст</center>
<html>
<head>
<title>Мой первый шаг </title>
</head>
<body text="#336699" bgcolor="#000000">
<center>
Здравствуйте, это моя первая страница.
<br>
<font color="#CC0000"> Добро пожаловать!</font> :) </center>
</body>
</html> (прим.)
Все было бы хорошо, и можно было бы шагнуть на следущую ступеньку, если бы у тэга <p> не существовало бы еще и четвертого, но опасного значения (атрибута):
<p align="justify">текст</p>
Это мой любимый атрибут параграфа, он выравнивает текст по обоим краям документа, и все становится милым и аккуратным. Почему же это опасный атрибут? Да не работает он в старых версиях броузеров, поэтому у тех, кто использует старые броузеры, он может не дейcтвовать (не отображаться), и вся красота-ляпота да аккуратность сойдет на нет (т.е. текст выровняется в таком случае по левому краю документа). Тем не менее я атрибутом justify злоупотребляю:)
<html>
<head>
<title>Мой первый шаг </title>
</head>
<body text="#336699" bgcolor="#000000">
<center>
Здравствуйте, это моя первая страница.
<br>
<font color="#CC0000"> Добро пожаловать!</font> :) </center>
<p align="justify">
Я совсем недавно начал(а) знакомиться с виртуальной жизнью, но мне по давней традиции тоже захотелось создать свою домашнюю страничку
