11 ноября 2012 года в11.11.2012 18:49 1 0 10 1

Я однажды уже делала пост по оформлению, но в нём я рассматривала и тексты и всё что угодно. Тут я хочу детально разобрать разнообразные красивые оформления для изображений :)

Рамки

➊.➊. Простая одинарная рамка

<p style="color: #; font-family: ''; font-size:; line-height:; text-align:center;"><img style="border: 1px solid # ЦВЕТ РАМКИ; padding: 2px" src= "ССЫЛКА НА ИЗОБРАЖЕНИЕ" width="300" /></p>

➊.➋. Простая двойная рамка

<p style="text-align: center;font-family:;font-size:; line-height:; border-style: double; color:# ЦВЕТ РАМКИ; "><img width="300" src= "ССЫЛКА НА ИЗОБРАЖЕНИЕ" /></p>

➊.➌. Двойная цветная рамка

<p style="text-align: center;font-family:; border-width:thick; border-style:groove; padding:4px; border-color:# ЦВЕТ РАМКИ; font-size:8.0pt"><img src= "ССЫЛКА НА ИЗОБРАЖЕНИЕ" width="480" /></p>

➊.➍. Рамка с тенью

<p style="text-align: center; text-align:;font-family:; font-size:; line-height: "><img height="204" style="box-shadow: 2px 2px 7px # ЦВЕТ ТЕНИ; border: 1px solid #cccccc; padding: 2px" src= "ССЫЛКА НА ИЗОБРАЖЕНИЕ" width="480" /></p>

➊.➎. Закругленная рамка

<p style="text-align: center; font-family:; color:#; font-size:; line-height: "><b><img src= "ССЫЛКА НА ИЗОБРАЖЕНИЕ" style="border-radius: 10px; border-style: groove; border-width: 2px; border-color: # ЦВЕТ РАМКИ; padding: 3px; background-color: # ЦВЕТ ФОНА МЕЖДУ РАМКОЙ И КАРТИНКОЙ" height="204" width="480" /></b></p>

Форма изображений

➋.➊. Закругленные края

<p style="font-family: ''; color:; text-align:center;line-height:;font-size:"><img height="204" width="480" src= "ССЫЛКА НА ИЗОБРАЖЕНИЕ" style="border-radius: ПИКСЕЛИ (ВЕРХНИЙ ЛЕВЫЙ УГОЛ) px ВЕРХНИЙ ПРАВЫЙ px НИЖНИЙ ПРАВЫЙ px НИЖНИЙ ЛЕВЫЙ px;" /></p>

➋.➋. Закругленные края с тенью

<p style="font-family: ''; color:; text-align:center;line-height:;font-size:"><img height="204" width="480" src= "ССЫЛКА НА ИЗОБРАЖЕНИЕ" style="border-radius: ПИКСЕЛИ (ВЕРХНИЙ ЛЕВЫЙ УГОЛ) px ВЕРХНИЙ ПРАВЫЙ px НИЖНИЙ ПРАВЫЙ px НИЖНИЙ ЛЕВЫЙ px;" /></p> box-shadow: 0 2px 10px # ЦВЕТ ТЕНИ;

➋.➌. Обычное изображение с тенью

<p style="line-height:;text-align: center; font-family:;font-size:;color:"><img width="480" height="204" style="border-radius: 0px 0px 0px 0px;box-shadow: 0 1px 7px # ЦВЕТ ТЕНИ" src= "ССЫЛКА НА ИЗОБРАЖЕНИЕ" /></p>

Расположение картинки

➌.➊. Обтекаемость текстом (справа)

<p style="text-align: center; font-family: ''; color:#; font-size:; line-height:;"><img width="200" align="right" src= "ССЫЛКА НА ИЗОБРАЖЕНИЕ" /></p>

➌.➋. Обтекаемость текстом (слева)

<p style="text-align: center; font-family: ''; color:#; font-size:; line-height:;"><img width="200" align="left" src= "ССЫЛКА НА ИЗОБРАЖЕНИЕ" /></p>

—-------------------------------------------------------------------

Надеюсь, вам пригодится этот небольшой "путеводитель" по оформлению картинок. Желаю вам и вашим постам быть неотразимыми; D

Комментарии

Зарегистрируйтесь или войдите, чтобы добавить комментарий

Новые заметки пользователя

YOUNGYOUNG — Это просто Вьюи блог

34

когда мы были младше. мы прятали руки под рубашку и говорили людям, что потеряли руки. перезагружали видеоигры, когда знали, что проиграе...

31

— Ты украл моё сердце! — Извини, оно реально нужно для ритуала.

32

марина бросила артёма оксана бросила илью а вова с крыши бросил вику и отомстил за всех друзей.

35

http://vk.com/id35955835

33

бывают девушки с изюминкой, а я явно с припиздоном