Шпаргалка HTML
По этой шпаргалке можно делать так, чтобы строка ползала слева направо или сверху вниз, делать буквы разноцветными и увеличивать их, делать всплывающие надписи на картинках и многое другое.
Форматирование текста- Зачеркнутый текст ТЕКСТ - ТЕКСТ
Подчёркнутый текст ТЕКСТ - ТЕКСТ
Полужирный текст ТЕКСТ - ТЕКСТ
Полужирный крупный ТЕКСТ - ТЕКСТ
Курсивный текст ТЕКСТ - ТЕКСТ
Маленький текст ТЕКСТ - текст
Неразрывный пробел &*nbsp; (* убрать)
Сноска вверху сноска ТЕКСТ сноска
Сноска внизу сноска ТЕКСТ сноска
Отступ текст -
отступ от отстального текста вот так
Ударe?ние (тэг ставим после нужной буквы) - &*#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:
body { cursor: crosshair }
- Также можно задать разный вид курсора для отдельных областей веб-страницы, используя теги DIV или SPAN:
На этом тексте курсор примет вид перекрестья.
Синтаксис:
На этом тексте курсор примет вид перекрестья.
Внимание!
Прежде чем воспользоваться возможностью переделать вид курсора, решите, а будет ли он использоваться к месту.
Многих пользователей подобные изменения могут ввести в заблуждение: когда, например, вместо традиционной "руки", появляющейся при наведении на ссылку, возникает нечто другое.
В большинстве случаев лучше оставить все по умолчанию.
- Тег SPAN предназначен для определения встроенных элементов документа. Иначе говоря, Элемент SPAN определяет контейнер для внутреннего текста.
В отличие от блочных элементов, таких как TABLE, P или DIV, с помощью тега SPAN можно выделить часть информации внутри других тегов и установить для нее свой стиль.
Например, внутри параграфа (тега P) можно изменить цвет и размер первой буквы, если добавить начальный и конечный тег SPAN и определить для него стиль текста.
Вот несколько примеров применения этого тега:
ЧЕРНЫЙ ТЕКСТ ПЕРЕЧЕРКНУТ КРАСНОЙ ЛИНИЕЙ
ЧЕРНЫЙ ТЕКСТ ПЕРЕЧЕРКНУТ КРАСНОЙ ЛИНИЕЙ
- СИНИЙ ТЕКСТ ПЕРЕЧЕРКНУТ ЖЕЛТОЙ ЛИНИЕЙ
СИНИЙ ТЕКСТ ПЕРЕЧЕРКНУТ ЖЕЛТОЙ ЛИНИЕЙ
- КОРИЧНЕВЫЙ ТЕКСТ ПОДЧЕРКНУТ ОРАНЖЕВОЙ ЛИНИЕЙ
КОРИЧНЕВЫЙ ТЕКСТ ПОДЧЕРКНУТ ОРАНЖЕВОЙ ЛИНИЕЙ
- ОРАНЖЕВЫЙ ТЕКСТ В СЕРОЙ РАМКЕ
ОРАНЖЕВЫЙ ТЕКСТ В СЕРОЙ РАМКЕ
- ЗЕЛЕНАЯ ССЫЛКА на мой дневник ПОДЧЕРКНУТА КРАСНЫМ ЦВЕТОМ
ЗЕЛЕНАЯ ССЫЛКАhttp://www.liveinternet.ru/users/642108" target="_blank" style="color:red;text-decoration:underline;"> на мой дневник ПОДЧЕРКНУТА КРАСНЫМ ЦВЕТОМ
- Скоро сказка сказывается...
Скоро сказка сказывается...
Д а не скоро дело делается... а не скоро дело делается...
Д а не скоро дело делается...
В зависимости от того, где мы пропишем второй закрывающий тег , текст после нашей "буквицы" будет набран таким же шрифтом или вернется в свое исходное состояние, обусловленное стилем страницы. Во втором предложении этот тег поставлен только после многоточия, а в первом после буквы "С".
- 1. Ваш текст
Вот так!
2. Ваш текст
или так
3. Ваш текст
ну и вот так
4. Ваш текст
или даже так
5. Ваш текст
а уж так!
6. Ваш текст
и так можем
Переменные:
HEIGHT высота "окошка", в котором двигается текст;
WIDTH расстояние, на которое перемещается текст.
Можно ли уменьшить скорость прокрутки при использовании тега marquee?
Так вот, для этого необходимо в открывающий тег добавить параметр scrollamount="Х", где Х - скорость прокрутки от 1 до 9.
Результат будет выглядеть так:
- Тег заставляет двигаться не только текст, но всё, к чему он относится.
Пример:
- Синтаксис:
- Чтобы превратить изображение в ссылку:
Синтаксис:
http://www.liveinternet.ru/users/697649 target="_blank" >
- Если нужно просто дать пояснение к своей картинке, то для того, чтобы получить всплывающую строку, нужно вписать тэг ALT="Пояснение"
Синтаксис:
- Изображение-ссылка, открывающаяся в новом окне:
Синтаксис:
- Текст между двумя картинками:
- Синтаксис:
Текст между двумя картинками.
Атрибут ALT - это маленький всплывающий комментарий, но в данном случае можно обойтись и без него.
- Фон под сообщением:
А у нас наступило лето... Затопило нас ярким светом, и жара. Только ранним утром с побережья приносит бриз.А в Москве - снова дождь по крышам; будто чья-то улыбка свыше, будто радость пригоршней щедрой - звонко с тучки на тучку - вниз...Тех, на дождь кто ворчит, не слушай, а смелей - босиком по лужам, подставляя ладони брызгам, переливчатым, как алмаз. Улыбнись случайным прохожим; ну а вдруг нарисует дождик , пусть пунктиром, пусть неумело - там, под струями, вместе нас?
Синтаксис:
Ваш текст сообщения
* Вместо URL подставляем адрес фоновой картинки
* На свой вкус и усмотрение меняем цвет, размер и начертание текста
- Рисуем линии:
1.
2.
3.
Синтаксис:
1.
2.
3.
Переменные:
SIZE толщина линии
COLOR цвет линии
- Линии бывают всякими:
1.
2.
3.
Синтаксис:
1.
2.
3.
Переменные:
WIDTH длина линии в процентах по отношению к экрану
SIZE размер элементов
DASHED пунктирная линия
DOTTED точечная линия
COLOR цвет элементов
- Рисуем рамочки:
1. Здесь будет Ваш текст2. Здесь будет Ваш текст3. Здесь будет Ваш текст
Синтаксис:
1. Здесь будет Ваш текст
2. Здесь будет Ваш текст
3.Здесь будет Ваш текст
Переменные:
border:3px #ff0000 толщина рамки в пикселях и её цвет
background-color: #ffff00 цвет фона рамки
dashed пунктир
solid непрерывная
padding отступ текста от рамки внутри
margin отступ от текста снаружи (если рамка находится внутри текста)
- В рамки можно помещать не только текст, но и картинки:
Первый поцелуй!
Синтаксис:
Первый поцелуй!
- Синтаксис:
И такая рамочка
Параметр align выравнивает относительно одной из сторон документа,
значения: left, right, или center
- Я принесла тебе поляну. На завтрак. Пока несла ее, все откусывали от нее по чуть-чуть и не верили вкусу земляники. Хорошо, что на поляне сидел тушканчик. Он-то и объяснял всем, что в мире нет ничего особенного, что это просто девочка несет поляну на завтрак своему другу. Лесную. С земляникой. Ну и что. Не всем же кофе в постель.
- Синтаксис:
padding отступ текста от рамки внутри.
- Можно добавить картинку:
Потом достать смешные акварели, изрисовать в нелепые цвета. Потом себя в оранжевый покрасить. Ты будешь - Солнце, вечное, всегда. И возле солнца - ангелы и бесы, песочницы, гитары, звон монет, коты и кастаньеты, апельсины, смешные дети, сильные мужчины. И в центре - твой улыбчивый портрет.
- Синтаксис для картинки:
- Вот такая кнопка!
- Синтаксис:
Название кнопки
- Кнопочка-посылалка:
http://www.liveinternet.ru/users/642108"; target="_blank" method="get">Некоторые специальные символы
- Некоторые символы не входят в базовую часть таблицы кодов ASCII. К ним относятся буквы алфавитов части европейских языков, математические и некоторые другие символы.
Некоторые символы, введенные в HTML документ будут интерпретироваться не так, как задумал автор. Это, например, символы "<" и ">", используемые для указания тегов.
В этих случаях можно вводить нужные символы с помощью специальных кодов.
Коды начинаются с символа "амперсанд"(&). За ним следует название символа, либо его числовой код в десятичной или шестнадцатеричной системе. Завершает код символ "точка с запятой" ;
Пишу разреженно, чтобы можно было прочитать код:
& quot; - двойная кавычка "
& amp; - амперсанд &
& lt; - знак 'меньше' <
& gt; - знак 'больше' >
& nbsp; - неразрывный пробел
Общая пунктуация:
& ndash; - тире -
& mdash; - длинное тире -
& lsquo; - левая одиночная кавычка '
& rsquo; - правая одиночная кавычка '
& sbquo; - нижняя одиночная кавычка '
& ldquo; - левая двойная кавычка "
& rdquo; - правая двойная кавычка "
& bdquo; - нижняя двойная кавычка "
И даже карточные масти:
& spades; - знак масти 'пики' ?
& clubs; - знак масти 'трефы' ?
& hearts; - знак масти 'червы' ?
& diams; - знак масти 'бубны' ?
- Пример:
? ? ? ?
Синтаксис:&*clubs; &*clubs; &*hearts; &*hearts;
(* убрать)
- Замечательных девушек -
