• 1558
  • 0
  • Автор: --------------
  • Адаптировал: irbees2008
  • Уровень сложности исполнения: это делается простым копированием и нажиманием кнопки

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

<img src="http://site/…jpg">

Уникальный адрес (URL) типа http://site/…jpg выдает картинке фотохостинг (специальный сайт), куда ее необходимо закачать с вашего компьютера. По сути, любая картинка, которую вы видите в сети — отдельная веб-страничка, имеющая свой уникальный адрес, начинающийся с http://… (посмотреть его всегда можно в свойствах картинки)

Среди «чайников» кочует миф, что можно показывать в блоге картинки прямо со своего компьютера. Это не так. Для этого ваш компьютер должен быть круглосуточно работающим веб-сервером.



Запомните: Если вы удаляете картинку из галереи хостинга (например, «фотоальбома жж»), то она исчезнет и из вашего блога!



Резюме: если знаете адрес своей или чей-то картинки формата http://…jpg вы можете опубликовать ее кодом:



Так вставляются картинки в комментарии к записям.

Как сделать, чтобы текст «обтекал» картинку?

Легко — картинка слева, текст справа:

добавляем в код картинки:

align=left hspace=20
Код картинки примет вид:
<img src="http:…" align=left hspace=20>

Помни:

align=left – картинка слева, текст справа

align=right — картинка справа, текст слева

hspace=20 — расстояние между текстом и картинкой 20 пиксел по горизонтали
vspace=20 — расстояние между текстом и картинкой 20 пиксел по вертикали

Код картинки с плавным обтеканием текстом справа и снизу (или сверху):

<img src="http:…" align=left hspace=20 vspace=15>

Прекратить обтекание и вернуть текст под картинку можно тэгом <br>

Закрывать не надо, он работает один. <br> выполняет перенос на следующую строку. В блогсервисах и редакторах текста его заменяет нажатие Enter.

<br><br><br> — три пустые строки.

Вставить две и более картинки горизонтально:

— все, заключенное в этот контейнер будет находиться на одной строке. Применять с осторожностью, можно деформировать пост.

Регулируем расстояние меж картинками по-горизонтали:

С помощью «неразрывного пробела»:  &nbsp;

Расстояние, равное 8 пробелам будет выглядеть так:



Вставляется меж кодов картинок, есс-но

Если надо всплывающую подсказку при наведении курсора на картинку, как здесь: — введите в код картинки title="ТЕКСТ"

Если надо цветную рамку , добавьте в код картинки: — задана красная рамка толщиной 5 пикселей

Чтоб быстро вставить картинку с другого сайта, вставьте в пост:



затем войдите в «Свойства» картинки на этом сайте, скопируйте ее URL и вставьте в код меж кавычек

Изменить размер картинки можно с помощью атрибутов width (ширина) и height (высота). Вставьте в код картинки, например, width=300 и ваша картинка будет шириной 300 пикселов, высота подгонится пропорционально. Браузер при этом все равно подгружает изначальную картинку, и если та весила 3МБ, то меньше не станет:)


Можешь почитать и вот эту статейку "Notepad++ "

mistakes

Это тоже интересно

Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь.
Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.

Ваше мнение

На каком движке ваш сайт?
Результаты

Облако тегов

Anything in here will be replaced on browsers that support the canvas element