lms
29/11/2009, 11:37
Esto es sólo una rápida valoración crítica de los mismos fundamentos para lograr la configuración de dos columnas para su uso en los foros a través sólo de CSS - sin modificaciones de plantillas ni plugins.
¡Esto no va a suponer enseñar CSS es este artículo! Usted deberá tener algún conocimiento básico de lo que son las Hojas de Estilo en Cascada. Aquí se expone a fin de profundizar un cambio que es solamente lo básico sin posicionar cosas, sin rellenos o márgenes o cualquier de otra índole de estilo aplicada - que es trabajo suyo.
Esto fue escrito durante la prueba de la beta3/beta4 y pueden necesitar ser modificados para su uso con otras versiones ya que las clases que pueden cambiar el estilo no han sido finalizado todavía. Esto fue escrito para el estilo predeterminado y stylevars predeterminadas (por defecto en este momento, lo que es). Si has personalizado el estilo de otra manera, es posible que tengas que cambiar esto un poco para que funcione con tu estilo. Estas clases también se aplican solo a la página principal del foro, pero se pueden modificar fácilmente (¡por usted!) para trabajar en las páginas forumdisplay y trabajar sólo para ciertas categorías.
Un ancho del navegador pequeño puede cambiar las cosas, o si tiene largas descripciones o sub-foros o moderadores en largas listas, puede que tenga que cambiar el CSS para dar cabida a eso. Como he dicho, esto en sólo un esbozo de lo que usted necesita hacer. Usted tendrá que agregar información de estilo por si mismo.
Esto es básicamente en lo que va a terminar:
Solo los usuarios registrados pueden ver enlaces
Fundamentos Básicos de lo que debes hacer
Añadir esto al final de la plantilla forumbits.css (o, al final de cualquier css adicional de plantilla que estés usando - se debe agregar * después * de que cualquier otras definiciones respecto a estos sub-foros hayan sido declaradas - si No entiendes por qué es así, por favor, lee de qué se trata sobre las Hojas de Estilo en Cascada):
.forumhead + .childforum .L2:first-child .forumrow, .forumhead + .L2 .forumrow {
border-top: 0;
}
.forumrow .table {
height: 100px;
}
ol.childforum {
float: left;
width: 100%;
margin: 0;
padding: 0;
}
.childforum li.forumbit_post {
float: left;
width: 50%;
margin: 0;
padding: 0;
clear:none;
}
#forums .L1 .L2 {
clear:none;
}
.forumbit_post .forumrow .forumlastpost {
clear:both;
width:95%;
}
.forumbit_post .forumlastpost .lastpostby {
display: block;
float: left;
}
.forumbit_post .forumlastpost .lastpostdate {
display: block;
float: right;
}
.forumbit_post .forumlastpost .lastposttitle {
display: block;
float: left;
}
.forumbit_post .foruminfo {
clear:right;
float:left;
min-width:50%;
width:70%;
}
.forumbit_post .forumstats, .forumbit_post .forumstats_2 {
width:20%;
}
Este mismo concepto se puede aplicar a cualquier lista en el estilo. Por ejemplo, puedes cambiar la lista de sub-foros en el marco de Sub-Foros en la página principal también con sólo un par de líneas:
.subforums ol.subforumlist {
float: left;
width: 100%;
margin: 0;
padding: 0;
}
.subforumlist li.subforum {
float: left;
width: 50%;
margin: 0;
padding: 0;
clear:none;
}
Estas líneas hacen esto (esto lo muestra con comas).
Si lo quieres sin comas, añade el código siguienteAl final del todo "para eliminar las comas" y no tendrás comas:
/* Para Borrar las Comas */
.commalist li.subforum:after {
content:"";
}
y te quedará así:
.subforums ol.subforumlist {
float: left;
width: 100%;
margin: 0;
padding: 0;
}
.subforumlist li.subforum {
float: left;
width: 50%;
margin: 0;
padding: 0;
clear:none;
}
/* Para Borrar las Comas */
.commalist li.subforum:after {
content:"";
}
Solo los usuarios registrados pueden ver enlaces
Una vez más, este artículo no pretende la enseñanza de CSS. Usted tendrá el estilo que usted quiera y también podrá hacer otros cambios para personalizar estilos pero las clases que pueden cambiar el estilo no han sido finalizado aún en el estilo de la beta 4.
Artículo original en Inglés: [HOW TO - vB4] Two column forum/sub-forum setup via CSS only (Solo los usuarios registrados pueden ver enlaces)
Salud2
¡Esto no va a suponer enseñar CSS es este artículo! Usted deberá tener algún conocimiento básico de lo que son las Hojas de Estilo en Cascada. Aquí se expone a fin de profundizar un cambio que es solamente lo básico sin posicionar cosas, sin rellenos o márgenes o cualquier de otra índole de estilo aplicada - que es trabajo suyo.
Esto fue escrito durante la prueba de la beta3/beta4 y pueden necesitar ser modificados para su uso con otras versiones ya que las clases que pueden cambiar el estilo no han sido finalizado todavía. Esto fue escrito para el estilo predeterminado y stylevars predeterminadas (por defecto en este momento, lo que es). Si has personalizado el estilo de otra manera, es posible que tengas que cambiar esto un poco para que funcione con tu estilo. Estas clases también se aplican solo a la página principal del foro, pero se pueden modificar fácilmente (¡por usted!) para trabajar en las páginas forumdisplay y trabajar sólo para ciertas categorías.
Un ancho del navegador pequeño puede cambiar las cosas, o si tiene largas descripciones o sub-foros o moderadores en largas listas, puede que tenga que cambiar el CSS para dar cabida a eso. Como he dicho, esto en sólo un esbozo de lo que usted necesita hacer. Usted tendrá que agregar información de estilo por si mismo.
Esto es básicamente en lo que va a terminar:
Solo los usuarios registrados pueden ver enlaces
Fundamentos Básicos de lo que debes hacer
Añadir esto al final de la plantilla forumbits.css (o, al final de cualquier css adicional de plantilla que estés usando - se debe agregar * después * de que cualquier otras definiciones respecto a estos sub-foros hayan sido declaradas - si No entiendes por qué es así, por favor, lee de qué se trata sobre las Hojas de Estilo en Cascada):
.forumhead + .childforum .L2:first-child .forumrow, .forumhead + .L2 .forumrow {
border-top: 0;
}
.forumrow .table {
height: 100px;
}
ol.childforum {
float: left;
width: 100%;
margin: 0;
padding: 0;
}
.childforum li.forumbit_post {
float: left;
width: 50%;
margin: 0;
padding: 0;
clear:none;
}
#forums .L1 .L2 {
clear:none;
}
.forumbit_post .forumrow .forumlastpost {
clear:both;
width:95%;
}
.forumbit_post .forumlastpost .lastpostby {
display: block;
float: left;
}
.forumbit_post .forumlastpost .lastpostdate {
display: block;
float: right;
}
.forumbit_post .forumlastpost .lastposttitle {
display: block;
float: left;
}
.forumbit_post .foruminfo {
clear:right;
float:left;
min-width:50%;
width:70%;
}
.forumbit_post .forumstats, .forumbit_post .forumstats_2 {
width:20%;
}
Este mismo concepto se puede aplicar a cualquier lista en el estilo. Por ejemplo, puedes cambiar la lista de sub-foros en el marco de Sub-Foros en la página principal también con sólo un par de líneas:
.subforums ol.subforumlist {
float: left;
width: 100%;
margin: 0;
padding: 0;
}
.subforumlist li.subforum {
float: left;
width: 50%;
margin: 0;
padding: 0;
clear:none;
}
Estas líneas hacen esto (esto lo muestra con comas).
Si lo quieres sin comas, añade el código siguienteAl final del todo "para eliminar las comas" y no tendrás comas:
/* Para Borrar las Comas */
.commalist li.subforum:after {
content:"";
}
y te quedará así:
.subforums ol.subforumlist {
float: left;
width: 100%;
margin: 0;
padding: 0;
}
.subforumlist li.subforum {
float: left;
width: 50%;
margin: 0;
padding: 0;
clear:none;
}
/* Para Borrar las Comas */
.commalist li.subforum:after {
content:"";
}
Solo los usuarios registrados pueden ver enlaces
Una vez más, este artículo no pretende la enseñanza de CSS. Usted tendrá el estilo que usted quiera y también podrá hacer otros cambios para personalizar estilos pero las clases que pueden cambiar el estilo no han sido finalizado aún en el estilo de la beta 4.
Artículo original en Inglés: [HOW TO - vB4] Two column forum/sub-forum setup via CSS only (Solo los usuarios registrados pueden ver enlaces)
Salud2