Заметки на полях

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



Вот примерно так это будет выглядеть в сообщении. Посмотрите налево.

Рекомендую к прочтению статью стили css в шаблоне блога.

Реализуем это с помощью совсем небольшого кода CSS и HTML.

<style>.stiker {
  font: normal normal 100% Georgia, Times, serif;
  color: #1A4676; /цвет текста/
  width:170px; /ширина стикера/
  float:left; /расположение слева/
  position:absolute;
  margin-left:-180px; /выравнивание относительно левого края/
  text-align:center;
}</style>

<div class="stiker">
Рекомендую к прочтению статью
<a href="http://www.shpargalochki.ru/2014/04/stili-css-v-shablon-bloga.html#more">стили css в шаблоне блога</a></div>

Если в коде CSS добавить стиль рамки, допустим, border: 2px solid blue;, то вид нашего стикера будет, как на картинке выше. Соответственно, изменив сам текст заметки. Я выделила его синим цветом.

Код устанавливается при написании сообщения. В том месте, где эту сноску хотим видеть. Перейдите из режима создать в режим HTML и вставьте его.

Если предполагаете его неоднократное использование, то код CSS лучше вставить в шаблоне блога. Вкладка шаблон-изменить HTML. Найдите строку ]]></b:skin> и сразу над ней установите его. При этом необходимо лишь убрать открывающийся и закрывающийся теги <style>...</style>.Потом при желании вывести заметку на полях просто добавляем код HTML.

Вот такая небольшая интересная примочка появиться на полях вашего сообщения.
А у меня сегодня всё. Спасибо, что читаете мои шпаргалки. До новых встреч.

Ой, а что это там ниже? Ну надо же! Нажимаем!

оформите подписку на новые шпаргалки

Введите Ваш email