2017

cu reduceri

CSS3 - Mai multe coloane de text

cascading style sheetsCu ceva timp în urmă am văzut cum împărţim un text în două coloane. Cand folosim rar acest stil nu este incomod de adaugat intr-o postare dar, daca folosim uzual impartirea textului in doua sau mai multe coloane intr-un post, atunci, va trebui sa ne folosim de propietatea CSS3 care ne ajuta rapid sa adaugam sau sa schimbam numarul de coloane dintr-un text.

In acest caz mergem la sablonul blogului si Aspect --> Editare HTML exact inaintea liniei ]]></b:skin> adaugam urmatorul cod:

.texto-columnas {
-moz-column-count:3;
-moz-column-gap:15px;
-webkit-column-count: 3;
-webkit-column-gap: 15px;
}

Poti mari numarul coloanelor prin modificarea liniilor: -moz-column-count:3; si -webkit-column-count: 3; (la 3, 4, sau 5 dar atentie! totul depinde de marimea spatiului care il ai la dispozitie pe blog). Salveaza modificarile si acum ori de cate ori doresti sa scri un text intr-un post adaugi:

<p class="text-coloana">Text</p>

Se inlocuieste Text cu descrierea care doresti sa apara si rezultatul este urmatorul:

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop

0 comentarios:

Trimiteți un comentariu

Bine ai venit!
In continuare poti lasa mesajul tau.

Multumesc