html - letra - Cómo usar css para cambiar el tamaño de fuente<pre>
tamaño de letra en css (9)
Creo que puede tener algo que ver con las fuentes estándar compatibles con diferentes navegadores. Pruebe su código en diferentes navegadores, pero recuerde que IE no es compatible con W3.
pre{font-family:cursive;font-style:italic;font-size:xxx-small}
¿Cómo cambiar el tamaño de fuente pre
?
Echa un vistazo aquí:
No puede cambiar el tamaño de fuente dentro de un elemento PRE (y no puede poner un elemento PRE dentro de un elemento FONT, por ejemplo), pero el elemento BASEFONT también afecta el texto preformateado.
Es probable que su problema se deba a que Courer se utiliza como fuente predeterminada. Si configura Courier New como la fuente preferida, debería estar bien.
Lo siguiente funciona bien tanto en Firefox como en IE
pre {
font-family: "courier new", courier, monospace;
font-size: 11px;
}
Lo siento por desenterrar un viejo problema. Después de buscar en alta y baja el "por qué los navegadores (especialmente los navegadores móviles) hacen que <pre>
etiquetas <pre>
demasiado pequeñas e ilegibles", encontré como se sugiere aquí, cambiar font-size:
css font-size:
para em
. Pero gotcha es em
para <pre>
efectos de tamaño diferente en el navegador de escritorio y en el navegador móvil. Una clara discrepancia notable en Android Samsung / Mozilla / Chrome aumenta el tamaño de la fuente menos por el mismo valor que em
los navegadores de escritorio. La solución a este dilema es usar %
lugar de em
.
La regla css pre{font-size:200%;}
parece aumentar el texto <pre>
más consistente (en comparación con otros textos) en el navegador móvil como lo hace en el navegador de escritorio.
No estoy seguro de si es la forma correcta de hacerlo, pero esto me funcionó en Firefox:
font: normal 11px Verdana, Arial, sans-serif;
Si bien el tamaño de fuente no se puede cambiar para el texto directamente dentro de las etiquetas pre, siempre puede ajustar ese texto en otro elemento (un tramo, por ejemplo) y cambiar el tamaño de fuente de ese elemento.
Por ejemplo (se trata de estilos en línea, pero se podrían colocar en CSS si lo desea):
<pre><span class="inner-pre" style="font-size: 11px">
Blah blah
Multiple lines and no br''s!
Oh yeah!
</span></pre>
Si solo necesita cambiar el tamaño de fuente una vez, puede escribir
<pre style="font-size: 10px">
...
</pre>
Una solución para corregir el tamaño de fuente en pre
etiquetas pre
es usar:
pre
{
white-space: pre-wrap !important;
}
Esto corrige los tamaños de fuente en los navegadores móviles, que no pueden determinar con precisión el ancho de un elemento pre
.
Fuente: el tamaño de fuente de la etiqueta pre en dispositivos móviles es demasiado grande: una solución
Aquí está la Demo
No estoy muy seguro de por qué mis navegadores (chrome, FF, IE) no están de acuerdo.
Por favor, hágamelo saber si me falta algo.
HTML
<pre>
Test
</pre>
css
pre {
font-size: 100px;
font-family: "Times New Roman", Times, serif;
font-style: italic;
}
Cromo
Firefox
ES DECIR