[Tú escribiste] > Primero que usar un entity para crear un bullet es ridículo.
¿Ridículo?¿por qué?. Supongo que lo dices porque ya existe un boliche predeterminado para las listas no ordenadas y, por lo tanto, no parece tener sentido el anularlo para incluir este carácter en el html. Sin embargo, el boliche predeterminado en las listas no ordenadas no se visualiza de forma coherente en diferentes navegadores. Si lo anulas y lo incluyes manualmente en el código consigues que se represente siempre igual, independientemente del navegador (aunque depende del tipo fuente elegida). Además, puedes usar otros caracteres, como el representado por la entidad » (comillas anguladas de cierre), y que no se encuentran entre los list-style-type. Aún así sigue siendo una mala opción de diseño debido a que rompe la separación estructura-estilo, pero no considero que sea ridículo. En http://webpelon.es/ovillo/2009-mes07-04-bullet_en_listas/ tienes un ejemplo. Prueba a visualizarlo en diferentes navegadores. [Tú escribiste] > Segundo. El span no es una etiqueta no semántica porque tiene contenido. Que contenga contenido no significa que la etiqueta sea semántica. Depende del uso que se haga de la etiqueta. En este caso, se utiliza como artificio para que el color (estilo) de los elementos de lista sea distinto del de los boliches. Una buena forma de entenderlo es intentar describir el significado de la etiqueta mediante palabras y sin incluir referencias a estilos. Por ejemplo, en: <li><span>Ignacio</span> Ricci</li> <li><span>Daniel</span> Navarro</li> se puede describir el significado del span como "nombre de pila", pero en <li><span>Elemento primero</span></li> no vale decir que es "elemento de lista sin boliche" porque incluye una referencia a estilos, en este caso, al boliche. Y si lo definimos como "elemento de lista", entonces tiene el mismo significado que el <li> y no aporta nada a la estructura. [Tú escribiste] >Tercero. La técnica del span u otro tag lo usan muchos sitios. Sí, es cierto. Pero si existe otro método igual de sencillo y que evite el uso de esta etiqueta cuando no añade significado al código, entonces es preferible usarlo. [Tú escribiste] > Cuarto. De ultima utilizaría un list-style-image o un fondo para el li > en caso de necesitar más versatilidad. Delirium Design pedía alguna forma de colorear el boliche sin usar imágenes y yo he planteado dos formas. Saludos. El 4 de julio de 2009 00:55, Ignacio Ricci<ignacio.ri...@gmail.com> escribió: > Primero que usar un entity para crear un bullet es ridículo > > Segundo. El span no es una etiqueta no semántica porque tiene > contenido. > > Tercero. La técnica del span u otro tag lo usan muchos sitios. > > Cuarto. De ultima utilizaría un list-style-image o un fondo para el li > en caso de necesitar más versatilidad. > > Ignacio Ricci. > www.ignacioricci.com > > On Jul 3, 2009, at 19:27, Daniel Navarro <webpe...@gmail.com> wrote: > >> Tienes razón. Tú metes el texto entero en un span y le aplicas un >> formato que lo diferencia del boliche. Éste está incluido en el li >> pero no en el span. Aún así adolece de una etiqueta no semántica ( >> el >> span). Es otra forma diferente de hacerlo que no tiene nada que ver >> con la que yo he puesto (disculpas). >> >> El indicar el carácter de boliche en el html tiene el defecto de >> incluir más contenido no semántico, pero la ventaja de una >> presentación más coherente entre navegadores, además de poder usar >> más >> tipos de boliches que los predefinidos para las listas no ordenadas. >> >> Saludos. >> >> El 3 de julio de 2009 13:55, Ignacio Ricci<ignacio.ri...@gmail.com> >> escribió: >>> No tiene sentido agregar el entity del bullet... Es contenido >>> innecesario. >>> Con anidar un span en el Li ya está... >>> >>> 2009/7/3 Daniel Navarro <webpe...@gmail.com> >>> >>>> Hola, >>>> >>>> El 2 de julio de 2009 20:18, Delirium >>>> Design<deliriumindes...@gmail.com> escribió: >>>>> habria alguna forma de ponerlo color solo al boliche , asi no uso >>>>> una >>>> imagen >>>>> , si no que le pongo el color que quiero al redondel. >>>>> Hasta ahora me cambia el redondel junto con el texto. >>>> >>>> >>>> Si existe un carácter que te sirva como boliche, entonces puedes >>>> aplicar estilo a éste sin tener que usar una imagen de fondo. >>>> >>>> Una solución consiste en establecer el boliche directamente en el >>>> archivo html y englobarlo en algún elemento (ej. span) para poder >>>> aplicarle estilo (esto ya te lo ha indicado Ignacio Ricci): >>>> >>>> [html] >>>> <ul> >>>> <li><span>•</span>Uno</li> >>>> <li><span>•</span>Dos</li> >>>> </ul> >>>> >>>> [css] >>>> li { >>>> list-style-type: none; /* elimina boliches */ >>>> } >>>> >>>> li span { >>>> color: green; >>>> margin-right: 0.3em; /* separa el boliche del texto */ >>>> } >>>> >>>> El inconveniente de esta solución es que no respeta una de las n >>>> ormas >>>> elementales del buen diseño web y que consiste en separar el dis >>>> eño de >>>> la estructura. Los boliches son diseño y deberían de especificar >>>> se en >>>> el css. >>>> >>>> >>>> >>>> En navegadores compatibles con el pseudoelemento :before se puede >>>> hacer lo siguiente: >>>> [css] >>>> li { >>>> list-style-type: none; /* elimina boliches */ >>>> } >>>> >>>> li:before { >>>> content: "\2022"; /* codificación en hexadecimal del ca >>>> rácter >>>> • */ >>>> color: blue; >>>> margin-right: 0.3em; >>>> } >>>> >>>> En la propiedad content se puede indicar directamente el carácte >>>> r que >>>> se quiera usar como boliche, pero si usas uno que no sea ASCII b >>>> ásico >>>> tendrás que tener cuidado en guardar el archivo css con la >>>> codificación apropiada (yo uso utf-8 sin BOM en mis archivos). Para >>>> evitar los problemas de codificación al guardar, es mejor indica >>>> r el >>>> equivalente hexadecimal, en este caso \2022. Tienes una tabla de >>>> referencia en http://ascii.cl/es/codigos-html.htm >>>> >>>> Lamentablemente hay navegadores como IE6 que no aceptan la anterior >>>> regla, aunque puedes indicarle algún list-style sólo a este nave >>>> gador >>>> mediante el uso de los comentarios condicionales. >>>> [html] >>>> <!--[if lte IE 6]> >>>> <link rel="stylesheet" type="text/css" >>>> href="ie6.css" /> >>>> <![endif]--> >>>> >>>> >>>> [ie6.css] >>>> li { >>>> list-style: disc inside; >>>> } >>>> >>>> >>>> Saludos >>>> _______________________________________________ >>>> 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 direc >>>> ción: >>>> http://lists.ovillo.org/mailman/listinfo/ovillo >>>> >>> >>> >>> >>> -- >>> ↓ Ignacio Ricci >>> www.ignacioricci.com >>> _______________________________________________ >>> 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
