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

Търсене

Breaking

Да разделим текст на публикация на колони

текст на колони
Здравейте мои редовни и нови читатели, блогъри и уебмастъри. След няколко дни на почивка се връщам на работа. И днес съм подготвила за вас, и за обсъждане, една нова интерпретация в темата на Blogger. Може би не за всички ще бъде полезна, но се надявам, че днешната публикация ще бъде от голяма полза за тези, които имат нужда от нея.
Не отдавна прегледах блога на мой читател, който искаше да го модернизира. Забелязах, че текстовете си той пише на български и английски език и е разделил страницата на една публикация на две колони. Колоната с български текст е в лявата част, а колоната в превод на английски език е от дясната страна. Като цяло, това ми се стори доста интересно. Тъй като много блогъри искат да постигнат този вид на своя блог, ето един пример за това, как ще изглежда вашия текст след като му зададете функция за разделяне на две колони. За да инсталираме и на нашия блог тази функция, трябва да минем по следния път: Резервно копие на тема ➔ редактиране на HTML кода и намираме участъка

]]></b:skin>

Преди него въвеждаме следния код:
.cronos
{
-webkit-column-count: 2;
-moz-column-count: 2;
column-count: 2;
Запазваме темата. След като напишем публикацията превключваме на HTML режим, за да сложим преди началото на текста


<div class='cronos'>

Това ще правим всеки път, когато искаме текста ни да е в две колони. По логика би трябвало в края на текста да добавим затварящия таг </div>,  но вместо нас това ще направи редакторът. Ако не стане, ще го въведем ръчно. Публикуваме. И е готово.
Ако искаме повече от две колони в нашия текст променяме в кода цифрата 2 на 3.


.cronos
{
-webkit-column-count: 3;
-moz-column-count: 3;

column-count: 3;


И ще изглежда така, както го виждате тук, или така.
Това е всичко. Връщаме се в нашия блог и проверяваме резултата в публикацията. Всичко е много лесно и просто.
Доскоро!

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

Ще съм благодарна да оцените моя труд и гласувате за блога на:

BGtop

5 коментара:

  1. Анонимен15:14

    Здравейте! Статията е чудесно обяснена, но при моят опит не се получи. Къде бих могла да бъркам? Поставям кода точно пред участъка b:skin. Интересното е, че при мен липсват всичките тези скоби, дали е възможно това да е проблема? Благодаря!

    ОтговорИзтриване
  2. Здравейте, къде бих могла да погледна за какво става дума?

    ОтговорИзтриване
    Отговори
    1. Здравейте, бихме ли могли да се свържем на лични? Благодаря!

      Изтриване
    2. Опитах да Ви пиша чрез формата за контакт, но не се получи. Имейлът ми е mircheva_78@abv.bg

      Изтриване
  3. Получи се! С Ваша помощ успях:). Още веднъж благодаря за прекрасният блог, полезната нформация и труда, който влагате в него, както и за отношението към читателите Ви! Поздрави, Екатерина

    ОтговорИзтриване