ЖЖ-ликбез. Выравнивание картинок в тексте
Nov. 22nd, 2010 11:04 pm
Легко и просто вставлять картинки, которые по ширине соизмеримы с шириной текстового поля вашего блога. Для этого достаточно пару раз нажать "Enter" после текста в визуальном редакторе или вставить пару тэгов <br />, если работаете (как я) в HTML-режиме, после чего сделать то же самое после вставки картинки, не заморачиваясь особо на обтекании её текстом (текст получится четко выше и ниже изображения).
Немного придётся потрудиться, если картинка небольшая и её приходится вписывать в текст. Как это выглядит в визуальном редакторе особо останавливаться не буду, поскольку всё видно в окошке предросмотра. Одно лишь скажу, что в данном случае стоит выбрать выравнивание по левому краю или (в некоторых случаях) по правому краю, не забыв при этом про отступы (!) Согласитесь, некрасиво, когда текст начинается прямо из картинки (при обтекании текстом справа) или заканчивается прямо в ней (при обтекании текстом слева). Но вот с отступами почему-то при работе в визуальном редакторе у меня ничего не получается. После того, как я вставил картинку в этот пост в визуальном редакторе и перешел в HTML-вкладку, код вставки выглядел следующим образом:
<img hspace="10" height="231" width="160" vspace="10" align="left" src="ссылка на картинку" alt="" />
За отступ, по идее должен отвечать атрибут vspace="10", но он почему-то отказывается выполнять свою работу. Поэтому я предпочитаю вставлять картинки в HTML, работая со стилями. Вот как выглядит код вставки картинки в моем варианте:
<img style="border: 0pt none; float: left; margin-right: 10px; margin-bottom: 10px; width: 200px;" alt="PROдвинутый блог о выравнивании картинок в тексте" src="ссылка на картинку" />
Если желаете, чтобы картинка отображалась в правой части поста, меняете в коде выравнивание на float: right; , а отступ на margin-left: 10px;
Ну вот и всё об этом :). Удачного блоггинга!
Хотя, конечно, на одном красивом дизайне блог или сайт держаться не будут. Хотите, чтобы плоды ваших трудов были доступны для всеобщего обозрения - продвигайте свой проект в поисковых системах. Отличную возможность раскрутить свой сайт по тематическим ключевым словам в таких популярнейших поисковых системах как Яндекс и Google предоставляет студия webakula.com.ua в Харькове. Пройдите по ссылке и узнайте как получить бесплатную консультацию и заказать услугу продвижение и оптимизация сайта в студии. Будьте первыми среди конкурентов!