Как сделать обтекаемую картинку в посте | | SEO для блондинки
Ищу:

Как сделать обтекаемую картинку в посте

Опять немного вэб программирования и оформления сайта.

Задачка такая: хочу вставить в пост картинку, но так чтобы она не одинокая посредине стояла, а чтобы текст ей как бы обтекал с одной стороны. Например обтекал справа. При этом чтоб изменение масштабов окна браузера обтекание не портило. То есть таблицы отпадают.

Технически это означает что нужно прописать в стилях для картинки параметр float — обтекание, равным «left». Картинка прижмётся влево, а текст будет справа

1. Давайте определим каким стилев и в каких блоках у нас эта картинка находится изначально.
Откроем страницу с одним постом (что бы искать попроще) с одной картинкой. Правая клавиша мышки — «Просмотр кода страницы» (это для хрома, в других браузерах может быть в кнопках или панелях на верху)
Выясните внутри какого блока у вас находится эта картинка, не заключена ли она в какой-то специальный блок.

2. Открываем редактирование style.css ( в вордпрессе: админка — внешний вид — редактор)
находим место в файле где описывается стиль блока внутри которого стоит картинка. Например у меня это оказался стиль art-PostContent После его описания есть описания стилей art-PostContent p (абзатц) и art-PostContent ul (маркированный список), а я ещё вставлю art-PostContent img (картинка). Указываю только один параметр float: left.

Вот так:

.art-PostContent img
{
float: left;
}

В сущности всё. Сохраняем изменения и идём смотреть что получилось.

 

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


Редактировать:

Вы можете подписаться на новые посты этого блога:



Комментарии (5) на запись “Как сделать обтекаемую картинку в посте”

  1. Василий 17.08.2011 10:32

    Все просто. Несколько раз повторить и запомнится. Спасибо!

  2. Андрей 06.08.2012 21:56

    Здравствуй. Все просто, но не все знают как сделать чтоб текст был с отступом.

  3. Андрей 06.08.2012 22:00

    Еще хотел бы сказать, конечно это не мое дело. но ссылки при наведении меняют шрифт и получается движение текста. Это плохо смотрится. Извени.

  4. Мисс Удача 07.08.2012 14:43

    пропишите в css отступы вокруг картинки. http://missudacha.ru/2011/04/sajtostroenie-css/

  5. Андрей 07.08.2012 23:21

    Здравствуй. Я в курсе этих мелочей. Имел ввиду иногда подробности помогают.

Обратные ссылки

Оставить комментарий




Загрузить свой аватар