Ознакомиться с предложением по сертификации и аттестации на сайте http//jurists.moscow - дистанционное обучение.

Недавно на основании всех этих полезностей я сменил дизайн. Сделал это потому что этот блог был первый и пробный - я вообще про всякие CSS HTML JavaScript ничего не знал, но мне очень хотелость чего-нибудь эдакого. Приглашаю посетить мой новый блог там будет много о чём поговорить. Ну а в этом будут советы, советы, советы в помощь блоггеру как и задумывалось!

четверг, 21 июня 2007 г.

Используем CSS на все 100%

Как вы увидели у меня появились новые примочки для красивого отображения текста в посте. Ясное дело, что эти примочки всё равно что орущий глушитель на убитой ВАЗ2109, но в арсенал блоггера прошу занести, ибо ...

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

1-й трюк - ну очень большая первая буква поста, а ля журнал.
Начнём с кода, который нужно разместить в css перед такой строкой ]]></b:skin> :

.dropcaps { float:left; color: $colorofbig; font-size:100px; line-height:80px; padding-top:1px; padding-right:5px; }

Я заявил в нём одну переменную $colorofbig, которую нужно описать сверху в описании переменных и она появится в НАСТРОЙКАХ->ЦВЕТА&ШРИФТЫ, если её не об'явить то blogger ругнётся и ничего не выйдет. Если описывать не хотите то замените эту переменную на цвет в формате #...... ну а если описать тогда вставьте такой код CSS после строки
/* Variable definitions

<Variable name="colorofbig" description="Цвет большой буквы"
type="color" default="#fff" value="#0d0600">


Теперь вы можете менять цвет буквы из админки вашего блога.
Это ещё не все, затем вы должны заменить шаблон вашего поста, для того чтобы каждый раз не вбивать в новый пост вызов описания первой буквы. ...вот по этой ссылке вы можете узнать как изменить шаблон вашего сообщения... А именно, вам нужно будет заключать первую букву поста в теги <span class="dropcaps">К</span> - почему буква К? Это к примеру, так как у меня в этом посте буква К первая, а какая у вас будет, такую и нужно вставлять.
Это всё по первому пункту, но у нас есть и второй.

2-й трюк - вот эта журнальная фича справа, ну можно её назвать как крупная выдержка из поста.

Для этого в описание CSS перед строкой ]]></b:skin> нужно вставить код назовём его magazin :

.magazin {
float:right;
height:6em;
width:150px;
margin-top:10px;
margin-bottom:10px;
margin-left:10px;
font-family: Arial,Helvetica,Georgia;font-size:22px;
line-height:18px;color:black;text-align:
right;
}


здесь в коде я не заморачивался с переменными а сразу задал их значения, поэтому нет переменных - нет надобности их описывать!

Чтобы использовать этот способ отображения выдержки нужно там где вы хотите её разместить поставить в посте:
<span class="magazin">Выдержка из поста тра-ля-ля</span>

Так как не в каждом посте это будет использоваться, ну по крайней мере где только надо, ну скажем обратить внимание, поэтому не стоит засовывать в шаблон сообщения эти теги, хотя на вкус и цвет?

3 комментария:

Михаил Валерьянович комментирует...

Спасибо за помощь )

Tn Pegas комментирует...

Реальные эффекты, поставил себе все работает как часы. И пос я тож себе взял, источник указан.Все в ажуре))))

happyblender комментирует...

как сделать так, чтобы заглавную букву разных постов делать разными цветами?