Gracias Anabel como comente al principio no habia mirado el tema de reducir los estilos aun pero tus sugerencias son bienvenidas y seran usadas. Manuel funciona a la perfección, gracias por la ayuda.
Saludos a todos y gracias Ing. Reynier Perez Mira eMail: reynie...@gmail.com, reynier. <reynie...@hotmail.com>pe...@treswd.com Website: http://www.reynierpm.com Skype: reynierpm Mobile: +58 424.180.5609 2012/9/4 Anabel Fernandez <anabelu...@gmail.com> > Hola Reynier, solo queria ayudarte a reducir la cantidad de estilos que > estas empleando: > > <ul class="box_content_navigation"> > <li><a href="inicio" class="icon-home">Inicio</a></li> > <li class="has_children"><a href="cmvblog" class="icon-blog >Blog</a> > <ul class="subitem"> > <li><a href="cmvblog/create">Crear > entrada</a></li> > <li><a > href="cmvblog/categories">Categorías</a></li> > </ul> > </li> > <li><a href="event" class="icon-event">Eventos</a></li> > <li><a href="members" class="icon-members">Directorio</a></li> > <li><a href="relations" class="icon-friends last">Amigos</a></li> > <li><a href="messages" class="icon-messages">Mensajes</a></li> > <li><a href="edit-profile" class="icon-account">Editar perfil</a></li> > <li><a href="admin" > target="_blank" class="icon-admincp hide-for-small">Panel de > Control</a></li> > </ul> > > ul.box_content_navigation li {border-bottom:1px dotted #CCCCCC;} > > ul.box_content_navigation li:first-child {border: none;} > > ul.box_content_navigation li a {padding-left: 35px; cursor: pointer;} > > .icon-home {background: url("../images/comvivem/ico_home.png") no-repeat > scroll 0 5px transparent;} > > .icon-home:hover {background: url("../images/comvivem/ico_home.png") > no-repeat > scroll 0 5px transparent;} > > .... > > Ya después solo tienes que cambiar los backgrounds, no tienes que repetir > los estilos siempre. > > Un saludo > Anabel > > > On Sep 4, 2012, at 4:49 PM, "reynie...@gmail.com" <reynie...@gmail.com> > wrote: > > > Interesante, exactamente eso es lo que estoy buscando mas no sabia que se > > podian "concatenar" por decirlo de alguna forma las clases de tal como lo > > haces tu en li.icon-event.current siempre pense hasta ahorita que era > > li.icon-event .current. Pruebo esta opción y te digo como me fue. > > > > Saludos y gracias > > Ing. Reynier Perez Mira > > eMail: reynie...@gmail.com, reynier. <reynie...@hotmail.com> > pe...@treswd.com > > Website: http://www.reynierpm.com > > Skype: reynierpm > > Mobile: +58 424.180.5609 > > > > > > > > 2012/9/4 Manuel Canga - Latrasweb.net <i...@latrasweb.net> > > > >> Sí, perfectamente. Ya me quedo totalmente claro. > >> En estas listas hemos hablado en varias ocasiones > >> de unir clases css. Esa podría ser tu solución. > >> > >> Veamos: > >> > >> <ul class="box_content_navigation" > >>> > >> <li class="icon-home first"><a href="inicio">Inicio</a></li> > >> <li class="icon-blog has_children"><a href="cmvblog">Blog</a> > >> <ul> > >> <li class="subitem first"><a href="cmvblog/create">Crear > >> entrada</a></li> > >> <li class="subitem last"><a > >> href="cmvblog/categories">Categorías</a></li> > >> </ul> > >> </li> > >> <li class="icon-event current"><a href="event">Eventos</a></li> > >> <li class="icon-members"><a href="members">Directorio</a></li> > >> <li class="icon-friends last"><a href="relations">Amigos</a></li> > >> <li class="icon-messages"><a href="messages">Mensajes</a></li> > >> <li class="icon-account"><a href="edit-profile">Editar > perfil</a></li> > >> <li class="icon-admincp hide-for-small"><a href="admin" > >> target="_blank">Panel de Control</a></li> > >> </ul> > >> > >> Fíjate que en li de eventos, le he añadido la clase current además > >> de la que ya tenía. > >> > >> ¿Cómo hacemos ahora para darle a ese elemento?. Así. > >> > >> li.icon-event.current { background: > >> url("../images/comvivem/icon_eventos_hover.png") > >> no-repeat scroll 0 4px transparent; background-color: #000 } > >> > >> > >> Fíjate, le he dicho al sistema css del navegador que quiero darle estilo > >> a un li que tenga la clase icon-event y que ademas tenga la clase > .current > >> Es decir, quiero darle estilo a un li cuando tenga ambas clases y luego > >> ponemos todas las propiedades de estilo que queramos darle en ese caso. > >> > >> El li lo he puesto por clarificar, siempre lo hago así, pero no es > >> necesario. > >> > >> > >> Un saludo > >> -- > >> Manuel Canga > >> Desarrollo creativo de > >> CMS y frameworks > >> Email: *i...@latrasweb.net* > >> Web: http://www.latrasweb.net > >> Twitter: http://twitter.com/latrasweb_net > >> > >> > >> > >> El 4 de septiembre de 2012 22:37, reynie...@gmail.com > >> <reynie...@gmail.com>escribió: > >> > >>> Hola Manuel y gracias por tu respuesta, precisamente eso es lo que > >> quiero o > >>> sea cambiar el color del fondo del LI que toma clase "current" pero > >>> manteniendo el icono asociado a la mismo en el estado hover. Veamos un > >>> ejemplo: supongamos que el li con class="icon-event" toma la clase > >> current > >>> tambien por lo cual quedaria li class="icon-event current" bueno si se > >> dan > >>> de cuenta ese icon-event tiene un estado por default > >>> .icon-event{background: url("../images/comvivem/ico_ > >>> eventos.png") no-repeat scroll 0 4px transparent;padding: 0 0 0 > >>> 35px;cursor:pointer;border-bottom:1px dotted #CCCCCC} y uno para cuando > >> se > >>> le hace un hover .icon-event:hover{background: > >>> url("../images/comvivem/ico_eventos_hover.png") no-repeat scroll 0 4px > >>> transparent;padding: 0 0 0 35px;cursor:pointer;border-bottom:1px dotted > >>> #CCCCCC}. Lo que tendria entonces que hacer digamos seria algo como > esto: > >>> .current {background: url("../images/comvivem/ico_eventos_hover.png") > >>> no-repeat scroll 0 4px transparent; background-color: #000} y > funcionaria > >>> pero solo para este elemento, que pasas si ahora mi clase current > >> estuvera > >>> en li class="icon-members current"? Como entonces cambiaria al > >>> .icon-members:hover? Me hago entender? > >>> > >>> > >>> Ing. Reynier Perez Mira > >>> eMail: reynie...@gmail.com, reynier. <reynie...@hotmail.com> > >>> pe...@treswd.com > >>> Website: http://www.reynierpm.com > >>> Skype: reynierpm > >>> Mobile: +58 424.180.5609 > >>> > >>> > >>> > >>> 2012/9/4 Manuel Canga - Latrasweb.net <i...@latrasweb.net> > >>> > >>>> No te he entendido bien. Si lo que quieres es que > >>>> a un li con una clase current se le cambie el color de fondo > >>>> pero los iconos se mantengan como el hover. Añade > >>>> a los estilos de current la imagen del icono que tienes en el hover. > >>>> > >>> _______________________________________________ > >>> Lista de distribución Ovillo > >>> Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org > >>> Puedes modificar tus datos o desuscribirte en la siguiente dirección: > >>> http://lists.ovillo.org/mailman/listinfo/ovillo > >>> > >> _______________________________________________ > >> Lista de distribución Ovillo > >> Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org > >> Puedes modificar tus datos o desuscribirte en la siguiente dirección: > >> http://lists.ovillo.org/mailman/listinfo/ovillo > >> > > _______________________________________________ > > Lista de distribución Ovillo > > Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org > > Puedes modificar tus datos o desuscribirte en la siguiente dirección: > http://lists.ovillo.org/mailman/listinfo/ovillo > > _______________________________________________ > Lista de distribución Ovillo > Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org > Puedes modificar tus datos o desuscribirte en la siguiente dirección: > http://lists.ovillo.org/mailman/listinfo/ovillo > _______________________________________________ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
