El tamaño de una viñeta está definido por el navegador, la fuente y el tamaño de la fuente. Aunque a veces puede aumentar el tamaño de la fuente para aumentar el tamaño de la viñeta, una mejor solución es utilizar una imagen como viñeta.
Para convertir una viñeta en una imagen, use CSS en su página similar al siguiente ejemplo.
ul {estilo de lista: ninguno; } ul li { background: url (// www.computerhope.com/issues/pictures/bullet.gif) no-repetir arriba a la izquierda; posición de fondo: 0 5px; línea de altura: 1.5625; relleno: 0 0 4px 30px; margen izquierdo: 1em; } En el código CSS anterior estamos configurando primero el
- Etiquetas para no mostrar ningún estilo de lista, lo que elimina la viñeta de la lista desordenada. A continuación, configuramos "ul li" para cambiar solo la apariencia de
- etiquetas que están contenidas en el
- etiquetas En la primera línea de esta sección se encuentra el fondo, que apunta a la imagen de viñeta que usamos en el ejemplo. Todas las demás líneas en este caso son el relleno y el margen alrededor de la viñeta.
Sugerencia: También puede crear una clase CSS si desea cambiar una sola viñeta o un grupo seleccionado de viñetas en una lista.
Después de que se haya creado el código, cualquier lista no ordenada de HTML utilizará la imagen de viñeta como la viñeta.
Código HTML de ejemplo
- Primer ejemplo de bala
- Segundo ejemplo de bala
Resultados de código HTML utilizando el ejemplo CSS.
- Primer ejemplo de bala
- Segundo ejemplo de bala