Безплатен блог на платформата Blogger (blogspot). Създаване, водене, персонализиране, дизайн, притурки в примери. Препоръки и съвети за начинаещи и напреднали блогъри.

Търсене

Breaking

Красиво оформяне на важен текст в блога

Красиво оформяне на важен текст
Драги читатели, приветстваме ви с добре дошли аз и Блог за блогове. Днес ще ви покажа как да си направите красив и необичаен дизайн на текст в която и да е публикация. Вече имах публикация на тази тема, но реших, че има блогове, които ще харесат тази идея, но значително по-семпла. Защото не всички блогъри могат сами да направят форматиран текст, атрактивен и информативен.
Предложеният проект за форматиран текст ще помогне да се отдели и сложи акцент върху основните моменти на публикацията. Този начин на оформянето ще направи текста в публикацията по-лесен за четене. И наистина, естетично декорираният текст е винаги по-привлекателен и по-запомнящ се. Вижте.
И така, да се подготвим за вмъкване в нашата публикация на форматиран текст. Ще оформим три блока с различен цвят на фона, в които ще вписваме онази част от нашия текст, която смятаме за много важна. Даваме им наименование. Моите са:

.blogzablogove-11, .blogzablogove-12, .blogzablogove-13

Вие можете да си измислите нещо друго.
И сега преминаваме към най-сложната и деликатна операция. Ще я правим много внимателно! Влизаме в админ панел ➔ избираме шаблон ➔ щракаме върху промяна в HTML кода на шаблона и пристъпваме към работа. Преди да променяме каквото и да е в шаблона правим негово копие! После визуално или с помощта на клавишната комбинация CTRL + F намираме в шаблона заветния ред ]]></b:skinПреди него вписваме кода за трите наши шаблона за форматиране на текст. Този, които ви предлагам, изглеждат така:



.blogzablogove-11, .blogzablogove-12, .blogzablogove-13
{margin:10px;
padding:15px 20px 15px 80px;
border:1px solid #999999;
border-radius: 10px;
-moz-border-radius:10px 10px 10px 10px;
box-shadow:2px 2px 3px #999999;
-moz-box-shadow:2px 2px 3px #999999;
-webkit-box-shadow: #999 2px 2px 3px;
background-position:20px 50%;
background-repeat:no-repeat;
position:relative;
text-align:justify;}
.blogzablogove-11
{background-color:#96DCFE;
background-image: url("");}
.blogzablogove-12
{background-color:#FFBFFE;
background-image: url("");}
.blogzablogove-13
{ background-color:#FEFF80;
background-image: url("");}




Сега започваме да пишем нашата публикация. Като стигнем до мястото в текста, което трябва ба бъде акцентирано, вписваме един от тези редове, но задължително в HTML режим.

       <div class=".blogzablogove-11">текст</div> 

 ➤<div class=".blogzablogove-12">текст</div>

 ➤<div class=".blogzablogove-13">текст</div>

Първият блок е с фон в синьо, вторият е в бледо лилаво, а третият е в пясъчно жълто. Тези цветове може да измените в първия код.
Още една подробност: красиво оформеният текст не се вижда в черновата на публикацията. Не се притеснявайте, ще се появи след публикуването му.

Желая ви красиво оформени текстове във всяка ваша публикация!

Доскоро!

Здраве за всички вас! Не забравяйте да правите добро на други хора!

Ще съм благодарна да оцените моя труд и кликнете върху звездичките по-долу. Или гласувайте за блога на:

BGtop


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

Публикуване на коментар