Зачеркнутый текст <s> ТЕКСТ </s> — ТЕКСТ
Подчёркнутый текст<u> ТЕКСТ </u> — ТЕКСТ
Полужирный текст<b> ТЕКСТ </b> — ТЕКСТ
Полужирный крупный <big> ТЕКСТ </big> — ТЕКСТ
Курсивный текст<i> ТЕКСТ </i> — ТЕКСТ
Маленький текст<small> ТЕКСТ </small> — текст
Неразрывный пробел &*nbsp; (* убрать)
Сноска вверху <sup> сноска</sup>
ТЕКСТ сноска
Сноска внизу <sub> сноска</sub>
ТЕКСТ сноска
Отступ <blockquote> текст</blockquote> —
отступ от отстального текста
вот так
Ударéние (тэг ставим после нужной буквы) — &*#769; (* убрать)
Текст с подсказкой:
Подведи курсор к тексту!
манипуляции с курсором
Наведите курсор на текст! Это default .
Наведите курсор на текст! Это auto . Наведите курсор на текст! Это text . Наведите курсор на текст! Это crosshair . Наведите курсор на текст! Это e-resize . Наведите курсор на текст! Это w-resize . Наведите курсор на текст! Это n-resize . Наведите курсор на текст! Это s-resize . Наведите курсор на текст! Это ne-resize . Наведите курсор на текст! Это sw-resize . Наведите курсор на текст! Это nw-resize . Наведите курсор на текст! Это se-resize . Наведите курсор на текст! Это wait . Наведите курсор на текст! Это hand . Наведите курсор на текст! Это pointer . Наведите курсор на текст! Это help . Наведите курсор на текст! Это move . С помощью стилей можно переопределить вид курсора и выбрать один из пятнадцати Если вы желаете переопределить курсор мыши для всей веб-страницы целиком, а не только для ссылок, воспользуйтесь селектором BODY Также можно задать разный вид курсора для отдельных областей веб-страницы, используя теги DIV SPAN На этом тексте курсор примет вид перекрестья.
Синтаксис:
<span style="cursor:crosshair">На этом тексте курсор примет вид перекрестья.</span>
Внимание!
Прежде чем воспользоваться возможностью переделать вид курсора, решите, а будет ли он использоваться к месту.
Многих пользователей подобные изменения могут ввести в заблуждение:
когда, например, вместо традиционной «руки», появляющейся при наведении
на ссылку, возникает нечто другое.
В большинстве случаев лучше оставить все по умолчанию.
Тег SPAN
Тег SPAN
предназначен для определения встроенных элементов документа. Иначе
говоря, Элемент SPAN определяет контейнер для внутреннего текста.
В отличие от блочных элементов, таких как TABLE, P или DIV, с помощью
тега SPAN можно выделить часть информации внутри других тегов и
установить для нее свой стиль.
Например, внутри параграфа (тега P) можно изменить цвет и размер первой
буквы, если добавить начальный и конечный тег SPAN и определить для
него стиль текста.
Вот несколько примеров применения этого тега:
ЧЕРНЫЙ ТЕКСТ ПЕРЕЧЕРКНУТ КРАСНОЙ ЛИНИЕЙ СИНИЙ ТЕКСТ ПЕРЕЧЕРКНУТ ЖЕЛТОЙ ЛИНИЕЙ
<span style="color:YELLOW;text-decoration:line-through;"><span
style="color:BLUE">СИНИЙ ТЕКСТ ПЕРЕЧЕРКНУТ ЖЕЛТОЙ
ЛИНИЕЙ</span></span>
КОРИЧНЕВЫЙ ТЕКСТ ПОДЧЕРКНУТ ОРАНЖЕВОЙ ЛИНИЕЙ
<span style="color:darkorange;text-decoration:underline;"><span
style="color:brown">КОРИЧНЕВЫЙ ТЕКСТ ПОДЧЕРКНУТ ОРАНЖЕВОЙ
ЛИНИЕЙ</span></span>
ОРАНЖЕВЫЙ ТЕКСТ В СЕРОЙ РАМКЕ
<span style="border:1px solid darkgray;"><span
style="color:orange;">ОРАНЖЕВЫЙ ТЕКСТ В СЕРОЙ
РАМКЕ</span></span>
ЗЕЛЕНАЯ ССЫЛКА на мой дневник С коро сказка сказывается...
<span style = "font-size: 100px;"><FONT FACE="Comic Sans
MS"><FONT
COLOR="#FF0000">С</FONT></FONT></span>коро сказка
сказывается...
Д а не скоро дело делается...
<span style = "font-size: 100px;"><FONT FACE="Monotype
Corsiva"><FONT COLOR="#0000FF">Д</FONT></span> а не
скоро дело делается...</FONT>
В зависимости от того, где мы пропишем второй закрывающий тег </font> ,
текст после нашей "буквицы" будет набран таким же шрифтом или вернется в
свое исходное состояние, обусловленное стилем страницы. Во втором
предложении этот тег поставлен только после многоточия, а в первом
после буквы "С".
Бегущая строка
1. <MARQUEE>Ваш текст</MARQUEE>
Вот так!
2. <MARQUEE style="HEIGHT: 50px" direction=up>Ваш текст</MARQUEE>
или так
3. <MARQUEE style="HEIGHT: 50px" direction=down>Ваш текст</MARQUEE>
ну и вот так
4. <MARQUEE style="WIDTH: 200px" direction=right>Ваш текст</MARQUEE>
или даже так
5. <MARQUEE style="WIDTH: 200px" direction=left>Ваш текст</MARQUEE>
а уж так!
6. <MARQUEE style="WIDTH: 200px" behavior=alternate>Ваш текст</MARQUEE>
и так можем
Переменные:
HEIGHT высота "окошка", в котором двигается текст;
WIDTH расстояние, на которое перемещается текст.
Можно ли уменьшить скорость прокрутки при использовании тега marquee?
Так вот, для этого необходимо в открывающий тег добавить параметр scrollamount="Х" , где Х — скорость прокрутки от 1 до 9.
Результат будет выглядеть так:
<MARQUEE style="WIDTH: 200px" direction=right scrollamount="Х">
Тег <marquee> заставляет двигаться не только текст, но всё, к чему он относится.
Пример:
[показать]
Синтаксис: <MARQUEE><img src="ros.gif"></MARQUEE>
Работаем с графикой
Чтобы превратить изображение в ссылку:
Синтаксис:
<A class=link_main title="Дневник Arnusha"
href="http://arnusha.ru/ target="_blank"
><img src=bab.gif BORDER="0"></A>
Если нужно просто
дать пояснение к своей картинке, то для того, чтобы получить всплывающую
строку, нужно вписать тэг ALT="Пояснение"
Синтаксис: <img src=kam.gif ALT="По-моему, это камелия" >
Изображение-ссылка, открывающаяся в новом окне:
Синтаксис: <a href="1.html" target="_blank"><img src="okno.gif" border=0></img></a>
Текст между двумя картинками:
[показать]
[показать]
"...Бабочки рассказывали ей свои секреты, а Цветы наперебой звали
покачаться вместе на тонких стебельках.
Но у нее был друг. К самому большому и красивому Цветку на поляне
торопилась она каждое утро, чтобы вместе полюбоваться прозрачными
капельками росы, в которых отражается весь мир!..."
Синтаксис:
<IMAGE ALIGN="LEFT" VALIGN="MIDDLE" SRC="адрес картинки"
ALT="комментарий">
<IMAGE ALIGN="RIGHT" VALIGN="MIDDLE" SRC="адрес картинки"
ALT="комментарий">
Текст между двумя картинками.
Атрибут ALT - это маленький всплывающий комментарий, но в данном случае можно обойтись и без него.
Фон под сообщением:
А
у нас наступило лето...
Затопило нас ярким светом, и жара. Только ранним утром с побережья
приносит бриз.А в Москве - снова дождь по крышам; будто чья-то улыбка
свыше, будто радость пригоршней щедрой - звонко с тучки на тучку -
вниз...Тех, на дождь кто ворчит, не слушай, а смелей - босиком по лужам,
подставляя ладони брызгам, переливчатым, как алмаз. Улыбнись случайным
прохожим; ну а вдруг нарисует дождик , пусть пунктиром, пусть неумело -
там, под струями, вместе нас?
Синтаксис:
<table width=100% border="0" cellspacing="8" cellpadding="0"
background="URL"><tr><td><font color=#FFFFFF font
face=georgia font size=3>Ваш текст
сообщения</font></td></tr></table>
• Вместо URL подставляем адрес фоновой картинки
• На свой вкус и усмотрение меняем цвет, размер и начертание текста
Линии и рамочки
Рисуем линии:
1.SIZE толщина линии
COLOR цвет линии
Линии бывают всякими:
1. WIDTH длина линии в процентах по отношению к экрану
SIZE размер элементов
DASHED пунктирная линия
DOTTED точечная линия
COLOR цвет элементов
Рисуем рамочки:
1.
2.
3.
Синтаксис:
1. <blockquote style="border:3px #00B344 dashed; padding: 15px;
margin:0px 0px 0px 0px;">Здесь будет Ваш текст</blockquote>
2. <blockquote style="background-color: #FFE4B5; border:3px #BC8F8F
solid; padding: 10px; margin:0px 0px 0px 0px;">Здесь будет Ваш
текст</blockquote>
3.<blockquote style="border:3px #DA70D6 solid; padding: 5px;
margin:0px 0px 0px 0px;">Здесь будет Ваш текст</blockquote>
Переменные:
border:3px #ff0000 толщина рамки в пикселях и её цвет
background-color: #ffff00 цвет фона рамки
dashed пунктир
solid непрерывная
padding отступ текста от рамки внутри
margin отступ от текста снаружи (если рамка находится внутри текста)
В рамки можно помещать не только текст, но и картинки:
Синтаксис:
<blockquote style="background-color: #E0FFFF; border:3px #87CEEB
solid; padding: 15px; margin:0px 0px 0px 0px;"><img src=pp.gif
BORDER="0">Первый поцелуй!</blockquote>
И такая рамочка
Синтаксис:
<FIELDSET><LEGEND align="center"><B><font
color=#FFA500>И такая
рамочка</font></B></LEGEND></FIELDSET>
Параметр align выравнивает относительно одной из сторон документа,
значения: left , right , или center
Разноцветные рамочки
Синтаксис:
<blockquote style="BORDER-LEFT: #F70000 3px solid; padding: 15px;
BORDER-TOP: #119931 3px solid; padding: 15px; BORDER-BOTTOM: #E3AF40 3px
solid; padding: 15px;BORDER-RIGHT: #924E96 3px solid" padding:
15px></blockquote>
padding отступ текста от рамки внутри.
Я
принесла тебе поляну. На завтрак. Пока несла ее, все откусывали от нее
по чуть-чуть и не верили вкусу земляники. Хорошо, что на поляне сидел
тушканчик. Он-то и объяснял всем, что в мире нет ничего особенного, что
это просто девочка несет поляну на завтрак своему другу. Лесную. С
земляникой. Ну и что. Не всем же кофе в постель.
Синтаксис для картинки:
<img src="k.jpg" align="right">
[показать]
Потом
достать смешные акварели, изрисовать в нелепые цвета. Потом себя в
оранжевый покрасить. Ты будешь – Солнце, вечное, всегда. И возле солнца –
ангелы и бесы, песочницы, гитары, звон монет, коты и кастаньеты,
апельсины, смешные дети, сильные мужчины. И в центре – твой улыбчивый
портрет.
Кнопочки
Синтаксис:
<BUTTON title="Текст-пояснялка к кнопке"><TABLE
border=5><TBODY><TR><TD><CENTER><FONT
color=#BA55D3 size=4>Название
кнопки</FONT></CENTER></TD></TR></TBODY></TABLE></BUTTON>
Кнопочка-посылалка:
Синтаксис:
<form action="http://arnusha.ru/"
target="_blank" method="get"><input type="submit"
value="Дневник Arnusha"></form>
Цветная кнопочка с картинкой
Некоторые специальные символы
Некоторые символы не входят в базовую часть таблицы кодов ASCII. К ним
относятся буквы алфавитов части европейских языков, математические и
некоторые другие символы.
Некоторые символы, введенные в HTML документ будут интерпретироваться
не так, как задумал автор. Это, например, символы "<" и ">",
используемые для указания тегов.
В этих случаях можно вводить нужные символы с помощью специальных кодов.
Коды начинаются с символа "амперсанд"(& ). За ним следует
название символа, либо его числовой код в десятичной или
шестнадцатеричной системе. Завершает код символ "точка с запятой" ;
Пишу разреженно, чтобы можно было прочитать код:
& quot; - двойная кавычка "
& amp; - амперсанд &
& lt; - знак 'меньше' <
& gt; - знак 'больше' >
& nbsp; - неразрывный пробел
Общая пунктуация:
& ndash; - тире –
& mdash; - длинное тире —
& lsquo; - левая одиночная кавычка ‘
& rsquo; - правая одиночная кавычка ’
& sbquo; - нижняя одиночная кавычка ‚
& ldquo; - левая двойная кавычка “
& rdquo; - правая двойная кавычка ”
& bdquo; - нижняя двойная кавычка „
И даже карточные масти:
& spades; - знак масти 'пики' ♠
& clubs; - знак масти 'трефы' ♣
& hearts; - знак масти 'червы' ♥
& diams; - знак масти 'бубны' ♦
Пример:
♣ ♣ ♥ ♥
Синтаксис:
<aligh=center><font color="red" size=7>&*clubs; &*clubs; &*hearts; &*hearts;</font>
(* убрать) [55x]
Arnusha