2009-09-06 16 views
8

Duplicar posible:
Allow users to change font size in a webpageCSS - Aumentar página Tamaño de fuente

Hola,

Tengo algunas páginas web. Me gustaría que el usuario haga clic en una imagen y aumenten los tamaños de fuente de todo el contenido de la página. es posible? ¿Si es así, cómo?

Sé que los navegadores tienen opciones dentro de ellos. Básicamente, quiero una forma de hacerlo en la página misma.

Gracias.

+1

Dupe: http://stackoverflow.com/questions/891980/change-font-size-in-a-webpage/892031 –

Respuesta

1

Si aumenta el tamaño de fuente de un elemento de nivel superior como <body>, entonces ese tamaño [modificado] será heredado por sus elementos secundarios (suponiendo que otras reglas CSS para esos elementos no anularan ese tamaño con un valor absoluto valor, lo que también habría arruinado el tamaño de fuente cambiante del usuario en su navegador).

This article (por ejemplo) dice que describe cómo cambiar los valores de CSS de forma programática.

20

tres cosas de conseguirlo:

Especificar el tamaño de fuente general en la etiqueta <body>. Por ejemplo:

body { font-size: 100%; } 

No utilice píxeles para especificar el tamaño de fuente en ningún otro lugar del documento.

p.somePara { font-size: 120%; } 
p.anotherPara { font-size: 1.4em; } 

Adjunte un manejador de eventos a esta imagen, para ajustar el tamaño de fuente en consecuencia. Usando jQuery, por ejemplo:

$("#largerTextImage").click(function() { 
    $("body").css("fontSize", "120%"); 
}); 

Listo.

+0

Editado para corregir un error de sintaxis itty bitty :) –

0

Yo diría que podría cambiar css.

Coloque todos los tamaños de fuente en un archivo CSS separado. Luego, duplica este archivo y cambia los tamaños de fuente. A continuación, utilice un fragmento de script js para convertir los archivos css.

Hay muchos tutoriales que explican todo al respecto. Here's one.

+0

Este es un método muy crudo que nunca usaría. –

+0

¿Por qué? Esto es bastante interesante ya que puede especificar diferentes tamaños de fuente para todos los elementos para mantener el control sobre el aspecto de su sitio web. – marcgg

+0

1) cambiar los archivos CSS así es un poco crudo, usar clases que agregue/elimine en el cuerpo sería mejor, ya que sería una actualización instantánea, no se descargarían nuevos archivos solo para cambiar el tamaño de la fuente. 2) Este método es mucho más apropiado para cambios de pequeña escala que para el ajuste de fuentes en todo el sitio. Esa es una gran cantidad de escritura CSS adicional para una característica tan pequeña. Mucho mejor que si necesitas esta característica, haces los métodos basados ​​en% o em como se explica en la respuesta de bigmattyh y dejas el método de esta respuesta para trabajos de alternancia de menor escala. –

Cuestiones relacionadas