Hola, hoy les mostraré como descifrar un código css, para hacerlo les daré un ejemplo muy sencillo, agregaremos una barra de anuncios C:
Bien lo primero que haremos será crear un campo de css, para eso vamos a:
Panel de administración====>Estilos y plantillas====>Estilos=====>TUESTILO=====>Global.css=====> MODO AVANZADO
Se irán hasta abajo y crearán un grupo nuevo; ejemplo:
Bien lo primero que haremos será crear un campo de css, para eso vamos a:
Panel de administración====>Estilos y plantillas====>Estilos=====>TUESTILO=====>Global.css=====> MODO AVANZADO
Se irán hasta abajo y crearán un grupo nuevo; ejemplo:
Código PHP:
<?php
/* TUNOMBRE*/
.BARRA 1 {
background: url(images/TUIMAGEN) 17px 12px no-repeat #FBF8F4;
padding: 8px 8em;
margin: 1em auto 20 auto;
border-radius: 15px;
border: 1px #E7E7E7;
font-weight: bold;
}
Bien, ahora ya tenemos un grupo, pero, ¿Cómo creamos más barras? Simple copia y pega desde el .BARRA1 y cámbiale el nombre y los valores C;
Ahora sí como editar un css:
Lo primero que notamos es:
/* TUNOMBRE*/ aquí reemplazas TUNOMBRE por el nombre de la categoría C: ejemplo: /*Barras de tutorial*/
Ahora lo siguiente:
.BARRA1 { el . (punto) indica que es un elemento del grupo ya hecho y BARRA1 es el nombre que le darás tu (puedes cambiarlo a tu gusto) y el { indica que inicia el código :3
Siguiente línea:
Código PHP:
<?php
background: url(images/TUIMAGEN) 17px 12px no-repeat #FBF8F4;
El siguiente código después del "#" es el código del color de fondo. Cambialo por el que gustes.
NOTA: una buena manera de cambiar la posición sin estar editando todo es la opción "inspeccionar elemento" de google chrome
Siguiente línea:
Código PHP:
<?php
padding: 8px 8em;
Siguiente línea:
Código PHP:
<?php
margin: 1em auto 20 auto;
Siguiente línea:
Código PHP:
<?php
border-radius: 15px;
Como verán la mía dice "radius" es un efecto de borde redondeado, si no desean esto borren esta línea y solo dejen la siguiente:
Código PHP:
<?php
border: 1px #E7E7E7;
Siguiente línea:
Código PHP:
<?php
font-weight: bold;
}
