lista de estilos css para joomla

4
Lista completa de Estilos CSS para Joomla 1.0.12 explicada en detalles!! Antes de empezar la línea de VideoTutoriales joomla dedicados a las plantilla, puedes ir documentándote con las CSS que maneja joomla, te recomiendo que vayas memorizando algunas, ya que este es uno de las aspectos liosos (por lo extenso), en la creación de plantillas. Pues aquí te dejo la lista de los estilos CSS que una joomla Estándar, bueno están la mayoría si falta alguna puedes hacérnoslos saber a través de los comentarios. Pues aquí tienes la lista del os Estilos CSS de las Plantilla en Joomla... /* Por Dinh Viet Hung (C) http://www.joomlart.com /* AJUSTES POR DEFAULT */ body {}/* Estilo para la etiqueta del body de su sitio Web, controla la familia fonts de su página, el background, etc.*/ p {} /*formateo de todos los artículos con <div> (division). Esto es un cath-all que sólo se aplica cuando ningún otro estilo ha sido definido.*/ td {} /*formateo de todos los artículos con la etiqueta <td>. Este ajuste por defecto es usado cuando ningún otro estilo ha sido definido.*/ tr {} /*formateo de todos los artículos con la etiqueta <tr>. Este ajuste por defecto es usado cuando ningún otro estilo ha sido definido.*/ ul {} /*formateo de todos los artículos (lista no solicitada) con la etiqueta <UL>. Este ajuste por defecto es usado cuando ningún otro estilo ha sido definido.*/ a:link {} /* Estilo General de los enlaces*/ a:visited {} /*Estilo General para los enlaces visitados*/ a:hover {} /*Estilo General para cuando el puntero pasa por encima.*/ hr {} /* Línea horizontal en su plantilla*/ hr.separator {} /*separador de noticias ( ___ )*/ /* AJUSTES DE FORMAS */ .button {} /*boton*/ .inputbox {} /*campos de escritura de formularios, caja de campos.*/ .search {} /*El Formateo de <div> que sostiene artículos de búsqueda: inputbox, palabra del search...*/ /* NAVEGACION/AJUSTES DE LOS MENUS, TOP MENU Y MAIN MENU, ETC., */ a.mainlevel{} /* Este estilo aplica para los elementos del MAIN en el menu */ a.mainlevel:link {} /*Todos los enlaces vistos normalmente.*/ a.mainlevel:visited {} /*Enlaces visitados edel menu principal*/ a.mainlevel:hover {} /*Vista de los enlaces cuando el puntero pasa por encima */ #active_menu {} /* Este estilo es para el elemento del menú cuando este está activo, hasta en una subposición en el main*/ ul#mainlevel-nav {} /*generalmente es usado para definir el estilo del top menu*/ ul#mainlevel-nav li{} /* define el estilo de los enlaces de una lista del top menu*/ #mainlevel-nav a:link {} /*enlaces vistos normalmente*/ #mainlevel-nav a:visited{} /*enlaces visitados */

Upload: maripao

Post on 06-Jun-2015

13.692 views

Category:

Documents


3 download

DESCRIPTION

Es un articulo donde se describe los estilos CSS que usa joomla, para poder modificarlos y hacer desde cero nuevos Templates o personalizarlos.

TRANSCRIPT

Page 1: Lista de Estilos CSS para Joomla

Lista completa de Estilos CSS para Joomla 1.0.12 explicada en detalles!!

Antes de empezar la línea de VideoTutoriales joomla dedicados a las plantilla, puedes ir documentándote con las CSS que maneja joomla, te recomiendo que vayas memorizando algunas, ya que este es uno de las aspectos liosos (por lo extenso), en la creación de plantillas. Pues aquí te dejo la lista de los estilos CSS que una joomla Estándar, bueno están la mayoría si falta alguna puedes hacérnoslos saber a través de los comentarios.

 Pues aquí tienes la lista del os Estilos CSS de las Plantilla en Joomla...

/* Por Dinh Viet Hung (C) http://www.joomlart.com /* AJUSTES POR DEFAULT */

body {}/* Estilo para la etiqueta del body de su sitio Web, controla la familia fonts de su página, el background, etc.*/

p {} /*formateo de todos los artículos con <div> (division). Esto es un cath-all que sólo se aplica cuando ningún otro estilo ha sido definido.*/

td {} /*formateo de todos los artículos con la etiqueta <td>. Este ajuste por defecto es usado cuando ningún otro estilo ha sido definido.*/

tr {} /*formateo de todos los artículos con la etiqueta <tr>.  Este ajuste por defecto es usado cuando ningún otro estilo ha sido definido.*/

ul {} /*formateo de todos los artículos (lista no solicitada) con la etiqueta <UL>. Este ajuste por defecto es usado cuando ningún otro estilo ha sido definido.*/

a:link {} /* Estilo General de los enlaces*/a:visited {} /*Estilo General para los enlaces visitados*/a:hover {} /*Estilo General para cuando el puntero pasa por encima.*/hr {} /* Línea horizontal en su plantilla*/hr.separator {} /*separador de noticias ( ___ )*/

/* AJUSTES DE FORMAS */

.button {} /*boton*/

.inputbox {} /*campos de escritura de formularios, caja de campos.*/

.search {} /*El Formateo de <div> que sostiene artículos de búsqueda: inputbox, palabra del search...*//* NAVEGACION/AJUSTES DE LOS MENUS, TOP MENU Y MAIN MENU, ETC., */

a.mainlevel{} /* Este estilo aplica para los elementos del MAIN en el menu */a.mainlevel:link {} /*Todos los enlaces vistos normalmente.*/a.mainlevel:visited {} /*Enlaces visitados edel menu principal*/a.mainlevel:hover {} /*Vista de los enlaces cuando el puntero pasa por encima */

#active_menu {} /* Este estilo es para el elemento del menú cuando este está activo, hasta en una subposición en el main*/

ul#mainlevel-nav {} /*generalmente es usado para definir el estilo del top menu*/

ul#mainlevel-nav li{} /* define el estilo de los enlaces de una lista del top menu*/

#mainlevel-nav a:link {} /*enlaces vistos normalmente*/#mainlevel-nav a:visited{} /*enlaces visitados */

#mainlevel-nav a:hover {} /*cuando el puntero del mouse pasa por encima*/a.sublevel{} /* Esta estilización es para elementos del submenu que tienen a

un PADRE (submenus)*//*(elemento subnivel) */

a.sublevel:link {} /*enlaces vistos normalmente*/a.sublevel:visited {} /*enlaces visitados*/

a.sublevel:hover {} /*cuando el puntero del mouse pasa por encima*/

Page 2: Lista de Estilos CSS para Joomla

.pagenavbar {} /*Coloca el estilo para la navegación en el footer (pie de página) ("<< Start < Prev Next > End >>") cuando ellos no aparecen como hipervínculos (cuando solo existan unos artículos).*/

.pagenavbar:link {} /*Estilo para el footer de  navegación; pie de página ("<< Start < Prev Next > End >>") cuando ellos hacen de hiper enlaces */

.pagenavbar:visited {} /*estilo que define cuando el enlace es visitado*/.pagenav {} /* es el nombre implicado, esto es para formatear textos para

aquellos "<< Start < Previous 1 Next > End >>" enlaces del footer */

a.pagenav:visited {} /*visitados*/

a.pagenav:hover {} /*cuando se pasa por encima de estos.*/a.readon:link {} /*Estilo para el "Read More" (Leer Más…) Es el enlace que

despliega en una página nueva los contenidos extensos de los artículos */

a.readon:hover {} /*cuando se pasa por encima del leer más..*/a.readon:visited {} /*cuando es visitado*/

.back_button {} /*Estilo para el botón “Atrás”("BACK" button)*/.pagenav_prev {} /*Estilo para el  botón PREV*/.pagenav_next {} /*Estilo para el botón NEXT*/

.latestnews ul {} /*Estilo para la lista de las últimas noticias (latest news) – por default, latest news es el modulo user1.*/

.latestnews li {}/* Estilo para los elementos en forma de lista del lates news*/

.mostread ul{} /*Estilo para la lista del modulo “más visto” – por defecto, más visto (most popular) es el modulo user2*/

.mostread li{}/*Estilo para los elementos en forma de lista del most popular*//* AJUSTE DE PAGINA REFERENTE A LOS CONTENIDOS*/

a.category:link {} /*enlaces*/

a.category:hover {} /*cuando se pasa por encima de ellos.*/a.category:visited {}/*enlaces visitados.*/

.blogsection {} /* Formateo de los enlaces en Blog section */.blog_more {} /*El "Más" (More) texto en blog section*/a.blogsection:link {} /* Pone el formato del enlace*/a.blogsection:visited {} /* mismo como encima, para poner el formato del enlace visitado*/

a.blogsection:hover {} /* mismo como encima, para poner el formato a los enlaces cuando el puntero del mouse pase sobre este*/

.componentheading {}/* Título del componente usado para desplegar el contenido, Blog, Contacs etc., .*/

.contentheading {} /* Título del contenido, artículo, etc. para ser mostrado.*/

.contentpane {} /* Tabla que sostiene toda la información que no son artículos (componentes, lista de categorías, formularios de contacto, etc).*/

.contentpaneopen {} /* Tabla que sostiene el texto actual para un artículo.*/

.contentpagetitle {} /*Título de los artículos*/a.contentpagetitle:hover {} /*Título de los artículos cuando aparecen como

enlaces */

a.contentpagetitle:link {} /*titulos vistos como enlaces.*/a.contentpagetitle:visited {} /*titulos visitados.*/

.contentdescription {} /* Formateo de la "DESCRIPCION" de secciones, categorías

(News/Weblinks/Latest news...) */

table.contenttoc {} /* Formatea la tabla, de las tablas de contenidos para páginas múltiples de contenido o artículos */

table.contenttoc td {} /* mismo como encima, usado para formatear el td y la tabla, como celdas */

table.contenttoc th {} /* mismo como encima, usado para formatear el  th de "Tablas de Contenido" ( Artículos normales del Index)*/

table.contenttoc td.toclink {} /* mismo como encima, usado para formatear texto toc link texts*/

a.toclink:link {} /* mismo como encima, usado para formatear el estado del texto enlazado (toc link text status)*/

a.toclink:visited {} /* texto enlazado una vez visitado*/a.toclink:hover {} /* texto enlazado cuando el puntero pasa encima de este*/

Page 3: Lista de Estilos CSS para Joomla

/* LISTADO DE SECCIONES MAMBO */

.sectiontableheader {} /* Esto es para estilizar la cabecera de las tables de la sección en una SECTION'es de la página.  Ejemplo: cabecera de la tabla "Date" (fecha), "Item Title" (título del artículo), "Author"(autor)   y "Hits" (vistas)*/

.sectiontableentry1 {} /*Barra de color blanco.*/

.sectiontableentry2 {} /*Barra de color gris, por lo regular estas se vén en las polls, contactos etc.,.*//* FORMATEO DE LOS MODULOS DE MAMBO */

table.moduletable {} /* Formateo de la tabla del modulo */table.moduletable th {} /* Formateo de la cabecera del modulo, y el título del modulo */

table.moduletable td {} /* Formateo de las celdas de la tabla, en la tabla del modulo *//* MISCELANEOS *//* Fechas , Autores*/

.createdate {} /* Para estilizar la fecha de creación del contenido /artículos, mostrado bajo el título del contenido */.modifydate {} /* Formateo del texto "Last updated on" (“Ultima actualización en”) al final de los artículos/contenidos */

.small {} /* Formateo del texto "Written by:...." (Escrito por: ...)*/

.smalldark {}/*Encontrado en página de resultados de encuesta, para el formateo del texto " Number of Voters".. (Número de votos) */

 /* Encuestas, Polls */

.poll {} /* formato del .td de la tabla de encuesta */

.pollstableborder {} /* pone las propiedades del borde en la tabla de la encuesta de votación *//* Enlaces del Sitio, componente Weblinks */

.weblinks{} /* Para formatear los títulos enlazados bajo el "Weblinks" Sección en el frontend */

a.weblinks:hover {} /* mismo como encima, para los enlaces con el mouse encima del enlace *//* Newsfeeds */

.newsfeedheading {} /* El título del newsfeed. NOTA: Este no afectará el título de noticias del newsfeed! */

.newsfeeddate {} /* La fecha en la newsfeed */

.fase4rdf {} /* Esto es el cuerpo del texto de la newsfeed *//* Buscar página */

table.searchintro {} /* Esto es para formatear la caja cuando "Buscar palabra: la prueba devuelve 4 tiempos" la caja que aparece después de que usted ha

insertado un valor de búsqueda. Aparece en el mainbody con los resultados de búsqueda */

/* MAMBO TABBED FRONTEND ADMIN INTERFACE *//* El CSS de abajo define como el frontend la interface de administración cuando ha entrado al sistema */

.ontab {}/* Para estilizar los botones "Tab" (etiqueta) cuando sean editados los contenidos a través del front end como en la aministración. Este .ontab es la estilización para la etiqueta tab cuando esta esté activa o después de "pulsarse" */

.offtab {} /* mismo como encima,  usado para estilizar los botnoes de etiqueta "Tab" cuando sean editados los contenidos a través del frontend. Esta es la estilización para la etiqueta tab cuando esta sea “No active” o cuando esta  no sea “Pulsada” */

.tabpadding {} /* este estilo es usado poniendo el tamaño de la etiqueta en el susodicho*/ .tabheading {} /* No estoy seguro para cuando es usado. No he logrado encontrar nada relacionado con esto hasta el momento. */

.pagetext {} /* Este estilo es usado para estilizar el contenido de la edición de formas de contenido (cuando HTMLArea se instala y en todas sus formas + contenidos) en el frontend e Interface de Administración */

/* Traducción Proyecto Hispano*//* Aportación Alicante*/