HTML, ЖЖ Тэги | Как форматировать текст, вставить картинку или ссылку

Mar 30, 2014 10:58





* * * Реклама: сервис DropBox, для хранения и раздачи файлов, увеличивает бонус-квоту далее... * * *

* * * Последний пост: «Как я починил iPhone 4 который начал тормозить после обновления до iOS 7 и пофиксил кнопку Home.»


Для тех, кто забывает или не знает как пользоваться тэгами форматирования текста в своих постах, я написал эту напоминалку.
Всё это - простейшие тэги, но, думаю, вы найдёте для себя что-то новое :D Пост частенько обновляется для вашего удобства.



Обновление: 4 февраля. Пролайкайте пост в фейсбуке! :) →

Обновление: 16 апреля. Что нового?

На заметку: Как правильно оформлять посты и блоги. Советы.

чтобы не искать:



HTML Тэги. Форматирование шрифта.
Полужирный текст
Выделение текста курсивом
Подчёркнутый текст
Зачёркнутый текст
Маленький шрифт
Большой шрифт

Знак сноскисверху или индексснизу от текста

Текст со всплывающей подсказкой

Шрифт размером 16 пикселей

Предопределённые размеры шрифта (могут быть от 1-го до 7-го):

Шрифт 3-го размера

Шрифт на 1 размер больше обычного

Заголовок 2-го размера

Шрифт Comic Sans Ms
Шрифт Monotype Corsiva

Tahoma, 15 пикселей

Последние посты автора:

Заходите, не стесняйтесь откомментить.



Карманная Памятка и Навигация

HTML и ЖЖ Тэги - Как оформлять текст и посты?


Полезные линки - список разных сайтов посвящённх ЖЖ функциональности.

Мой ЖЖ-Дизайн - советы и исходные коды для Дизайна вашего ЖЖ стиля S1 Generator и не только!.

Сайты предоставляющие хостинг картинок - Куда выложить фотки?

© via alex_inside



Синий текст

Цифра 0000ff означает синий цвет в RGB палитре.
Также можно пользоваться стандартными словесными обозначениями цветов вот так:

red">Красный текст

У фона тоже можно менять цвет, вот так:

#eeeeff;">голубой фон

lightgray; color:#0000ff;">синий текст, серый фон

Обратите внимание на синтаксис. Аттрибут style использует синтаксис CSS.

Вот некоторые предопределённые цвета:

Black
White
Red
Green
Blue
Purple

Firebrick
Maroon
OrangeRed
MidnightBlue
CornflowerBlue

Cyan
Yellow
Magenta

DarkGreen

DarkGoldenrod
Gold
Orchid
BlueViolet
Burlywood
PeachPuff

В шестнадцатиричном коде указывающем интенсивность красного, зелёного и синего (RRGGBB):

#000000
#FFFFFF
#FF0000
#00FF00
#0000FF
#FF00FF
#FF4444
#FF9999
#FFCCCC
#9999FF
#FF99FF

#DDDDDD

#FFE4C4
#CCCC99
#FF8DC
#FA8072
#990000
#FF3030
#000080
#000066
#0000CD
#AFEEEE
#006400
#66FF00
#00B800
#DAA520
#FFCC33
#FFA500
#C71585

#8B008B
#CC33FF


Выбрать подходящие цвета:


© via alex_inside

HTML Тэги. Форматирование параграфов.
Оформить отступы абзацев, легко:



Процитированый в отдельном блоке текст

у которого будет

небольшой отступ слева.

blockquote>

margin:8px; padding:6px; border:1px solid #bbbbbb; width:400px;">
Я врезаный, обтекающий другим текстом, текст с правого краю с выравниванием слева,
с серой рамкой и отступом от рамки снаружи в 8 пикселей

1. Этот блок вставлен в текст слева перед (!) словом «Привет!»

2. Если блок внутри lj-raw, то переносы строк нужно указывать тэгом < br>
Привет! В этом абзаце первое предложение будет с красной строки, т.е. с отступом. Прямо как в книгопечати. Правда, в интернете это редкая практика. Абзацы должны разделяться просто пустым промежутком.

Опачки! Этот абзац будет написан с фиксированой шириной в 300 пикселей. Узенько так типа. А если добавить style="width:300px; float:right;" тогда он ещё и будет висеть справа. Смотрите пример чуть ниже.

Преформатированый текст
сохраняет отступы слева и между словами
и устанавливает те что вы укажите пробелами.
NB! тэг не делает переноса строки автоматом!
pre>

отцентрированый текстcenter>


текст с правого краю

в две строчки с выравниванием справа
div>

текст с правого краю

в две строчки с выравниванием слева
div>


бегущая влево строкабегущая вправо строкабегущая от края к краю строка
скролящийся вверх

текст с полезной

информацией

или ещё какой-то ерундой
или ещё какой-то ерундой

информацией

текст с полезной

скролящийся вниз » Как вместо ката сделать вертикальную перемотку большого текста?
style="overflow:auto; height:80px; width:500px; padding:8px; border:1px solid #ccc;">
Лорем ипсум долор сит амет, консектетур адиписицинг элит, сед до эиусмод темпор инцидидунт ут лаборе эт долоре магна аликуа. Ут эним ад миним вениам, кьюс ноструд эксерцитатьён ульламко лаборис ниси ут аликуип экс эа коммодо консекуат. Дьюс ауте ируре долор ин репрехендерит ин волуптате велит эссе киллум долоре эу фугиат нулла париатур. эксцептеур синт оккаекат купидатат alex_inside нон пройдент, сунт ин кульпа куй оффициа десерунт моллит аним ид эст лаборум.Если надо HTML-код вставить, показать кому-то, то то же самое можно сделать