Обтекаемые картинки

воскресенье, 27 февраля 2011

17:14

все записи пользователя в сообществе Тайя.

Не говорите так быстро, я не успеваю класть х*р на ваши слова.

Картинка с обтекающим ее текстом.
Картинка слева: <img src="адрес картинки" style="float: left; margin-right: 10px;"> Текст текст текст...
Картинка справа: <img src="адрес картинки" style="float: right; margin-left: 10px;"> Текст текст текст...
Margin - это отступ текста от края картинки, размер задается по вкусу.

Обтекаемые превьюшки.
Делаете превью любым доступным вам способом (про вставку превью рассказывается здесь, здесь, здесь и здесь) и затем к ссылке добавляете style="float: left; margin-right: 10px;" либо style="float: right; margin-left: 10px;".

<a href="адрес картинки"><img src="адрес картинки" width=XX style="float: left; margin-right: 10px;"></a>

Если картинка из БИ: <a href="картинка"><img src="превью" style="float: left; margin-right: 10px;"></a>

Текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст

[MORE=<img src="адрес картинки" width=XX style="float: right; margin-left: 10px;">]<img src="адрес картинки" style="float: right; margin-left: 10px;">[/MORE]

Из БИ: [MORE=<img src="превью" style="float: right; margin-left: 10px;">]<img src="картинка" style="float: right; margin-left: 10px;">[/MORE]

Текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст тексттекст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст

@темы: Добавление изображений, Теги оформления записи

URL

Море! Море? Море.... И рыбы... :tongue: Вся боль находится внутри нас, она не существует сама по ... Тута несколько умных мыслей, но, к сожалению, не моих.......

Ну е-мое!!! В Домбае я потерял маску Smith, теперь мои лю... спасибо тебе, Вэ, спасибо! Благодаря ссылке моего друга В... м-да... и еще раз - рррр...

Комментарии

16.03.2011 в 20:06

Ozariya

Я - женщина, а значит я на кухне, ой, простите, актриса.

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

URL

16.03.2011 в 20:14

Тайя.

Не говорите так быстро, я не успеваю класть х*р на ваши слова.

Ozariya, сделайте картинку полупрозрачной в пнг, и поставьте фоном таблицы)) Прозрачный квадрат, а в углу полупрозрачную картинку)) И текст поверх)))))

URL

16.03.2011 в 20:28

Ozariya

Я - женщина, а значит я на кухне, ой, простите, актриса.

Души романтиков , мамамоя, это же элементарно!
спасибо большущее!!

URL

16.03.2011 в 23:51

- апрельская Кошка -

Как всё интересно! Спасибо большое!

URL

17.03.2011 в 12:31

Тайя.

Не говорите так быстро, я не успеваю класть х*р на ваши слова.

Ozariya, правда если ставить картинку на фон, может по-разному пост отображаться в дневнике и в комментах...
- апрельская Кошка -, пжалст :-D

URL

08.04.2011 в 20:51

Zelmedv

Без дивов и таблиц. Помещаете картинку под текстом и стилями картинки: задаёте отрицательный margin-top

text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text

text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text 
<img src="http://static.diary.ru/userdir/1/8/2/8/1828072/67008419.png" style="float: right; margin-top: -100px; opacity:0.5; filter: alpha(Opacity=50);">

URL

09.04.2011 в 09:13

Тайя.

Не говорите так быстро, я не успеваю класть х*р на ваши слова.

text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text

Клево)) А ларчик просто открывался)
Zelmedv, спасибо.

URL

09.04.2011 в 17:01

Zelmedv

<img src="http://static.diary.ru/userdir/1/4/3/9/1439841/66349527.jpg"><img style="-moz-transform: rotate(-120deg); margin: 0px 0px 120px -170px" src="http://preview.shareapic.net/preview7/023390806.png" >

URL

09.04.2011 в 20:55

- апрельская Кошка -

Zelmedv, ой, какая няка!!!!!!! :inlove:

)))))))))))))

URL

10.04.2011 в 13:39

Тайя.

Не говорите так быстро, я не успеваю класть х*р на ваши слова.

Вау!

URL

30.04.2011 в 21:46

а где можно прочитать про море в море?

URL

02.05.2011 в 11:47

Текст текст текст

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

URL

05.05.2011 в 18:17

Тайя.

Не говорите так быстро, я не успеваю класть х*р на ваши слова.

мАленькаЙ идиЁт, как именно вы хотите сделать? чтоб картинка была фоном текста?

URL

05.05.2011 в 18:21

да..но не совсем..чтобы картинка была сбоку и одновременно под текстом...

URL

05.05.2011 в 18:43

Тайя.

Не говорите так быстро, я не успеваю класть х*р на ваши слова.

Ну вот как-то так...

text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text

<img src="http://static.diary.ru/userdir/1/4/3/9/1439841/66349527.jpg" style="float: left; margin-right: -300px;">

Отрицательным отступом картинка загоняется под текст.

URL

05.05.2011 в 19:13

оу! спасибо! счас попробую!
только объясните пожалуйста про отступ....
если я например хочу чтою текст занимал полкартинки....в высоту...а не в ширину....что мне надо задать?

URL

05.05.2011 в 19:18

margin-right это что у нас справа?

URL

05.05.2011 в 19:30

нннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннн
ннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннн
ннннннннннннннннннннннннннннннн
нннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннн
ннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннн
нннннннннннннннннннннннннннннннннннннннннннннн
ннннннннннннннннннннннннннннннннннннннннннннннннннннннн
нннннннннннннннннннннннннннннннннннннннннн
ггггггггггггггггггггггггггггггггггггггггггггггггггггггггггг
ннннннннннннннннннннннннннннннннннннннннннннннннннннннннннн
ннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннн
нннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннн
нннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннн
ннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннн
нннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннн
нннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннн
нннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннннн
ннннннннннннннннннннннннннннннннннннннннн
нннннннннннннннннннннннннннннннннннннн
ннннннннннннннннннннннннннннннннннннннннннннннннннннннн

что мне надо исправить чтобы он справа стоял?

URL

05.05.2011 в 19:44

уррра нашел!! спасибо! :white:

URL

05.05.2011 в 19:53

Тайя.

Не говорите так быстро, я не успеваю класть х*р на ваши слова.

мАленькаЙ идиЁт, ура))

URL

05.05.2011 в 23:58

Zelmedv

<img src="http://s61.radikal.ru/i174/1105/e5/cbb6b88bbffd.jpg" style="float: right; margin-top: -400px;">

URL

06.05.2011 в 00:01

Zelmedv спасибо! я уже рабобрался))) но этот тоже сохраню))) спасибо!

URL

27.06.2011 в 02:16

snarka

Тайя, которая душит романтиков вот спасибо!! : ))

А я делала не через стили, а так: img src=... hspace=10 align=left
Но меня жутко раздражала, что отступ получается с обеих сторон. А тут - с одной, классно! : ))

А про отрицательный отступ ваще блеск!

URL

08.07.2011 в 20:34

Други, подскажите пожалуйста, как спрятать море под картинку?

URL

08.07.2011 в 20:39

Тайя.

Не говорите так быстро, я не успеваю класть х*р на ваши слова.

funny-bone, так же как и текст.

[MORE=тут котята]<img src="адрес картинки">[/MORE]

тут котята

URL

08.07.2011 в 20:44

а чо-то у меня так не получилось, пойду еще пробовать. спасибо!

URL

08.07.2011 в 20:47

Тайя.

Не говорите так быстро, я не успеваю класть х*р на ваши слова.

funny-bone, вы делайте в хтмл-редакторе, не в визуальном. Вставили код картинки - и его под море.

URL

08.07.2011 в 20:58

я вс в хтмл делаю)
нет вы меня не правильно поняли, мне не картинку под море надо,

а море под картинку)

URL

08.07.2011 в 21:01

Тайя.

Не говорите так быстро, я не успеваю класть х*р на ваши слова.

funny-bone, ааа, чтобы была картинка, а под ней текст?

Так что ли?

[MORE=<img src="http://static.diary.ru/userdir/1/4/3/9/1439841/66349527.jpg">]тут под картинкой всякие буквы[/MORE]

URL

08.07.2011 в 21:02

да, целый пост)))

URL

← Предыдущая 1 2 3 4 Следующая → Последняя


Запомнить

Обтекаемые картинки

@Секреты и хитрости