Pregunta

Para IE7, es posible agregar

filter: none;

al cuerpo css para deshabilitar cleartype en fuentes a través de CSS. No me gusta el aspecto difuso que da, y no es realmente consistente en todos los navegadores. ES DECIR; Firefox e IE6 lo muestran de manera diferente.

IE8, sin embargo, parece ignorar la opción css, incluso cuando se fuerza el navegador al modo de compatibilidad de IE7 usando:

<meta http-equiv="X-UA-Compatible" content="IE=7" />


TL; DR: ¿Cómo desactivo las fuentes de tipo claro en IE8 a través de CSS?

¿Fue útil?

Solución

Por lo que recuerdo, Internet Explorer 7+ deshabilita ClearType cuando se establece un filtro en un elemento

#target {
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=99)";
    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=99);
}

Además, tenga en cuenta que muchos usuarios pueden encontrar molesto desactivar ClearType. ¡Use con moderación!

Otros consejos

No puedes. ClearType es una configuración de usuario en el navegador. Es muy probable que cualquier CSS que lo deshabilite para ciertos elementos sea un error, no una función (he notado que se deshabilita para algunos elementos generados dinámicamente o animados) y no se debe confiar en él.

Cualquiera que sea su preferencia a este respecto, probablemente no sea el usuario que ve su sitio. ¿Entonces, para qué molestarse? Quien no le guste ClearType probablemente ya lo tenga desactivado.

Nota: La razón por la que funciona con filtros es que los filtros no son representados por el navegador sino por algo más (probablemente DirectX, considerando el "DX" allí. Todavía lo consideraría un efecto secundario y no una característica).

Nota 2: Corregido a partir de IE 9, como se esperaba. Esta es realmente una batalla que solo puedes perder, como muchos te han dicho antes, excepto que no escucharías.

Juliano, body {filter: none} es una solución mejor y más limpia. El uso de la opacidad causa problemas en algunas situaciones.

Para responder a todos los entusiastas de ClearType, también me gusta ClearType. Creo que es un gran avance para los monitores LCD. El problema es que cuando IE intenta usar ClearType en algunos elementos específicos, se ve peor que si hubiera desactivado ClearType. Estos incluyen elementos que se desvanecen en la vista (usando javascript), así como las fuentes @ font-face importadas. Si te gusta ClearType, entonces vas a odiar lo que IE hace cuando intenta usar ClearType en estas situaciones ... tu texto se ve grueso, feo y grueso.

En estos casos, ClearType debería eliminarse si es posible para lograr las fuentes suaves que desean.

No hay una solución CSS para deshabilitar cleartype. La razón por la que pudo hacerlo en IE7 fue un biproducto de cómo el navegador representaba el texto en elementos que usaban filtros. Aparentemente, IE8 maneja esto mejor para que no puedas usar ese truco más (al menos no sin aplicar algún filtro).

El uso de cleartype es una opción del usuario, y no es algo que deba imponer a los visitantes. Personalmente, me gusta mucho cleartype, y si visitara un sitio donde estaba deshabilitado, pensaría que el sitio se veía realmente mal.

El hecho de que el texto se represente de manera diferente en diferentes navegadores y diferentes sistemas operativos es algo con lo que tiene que vivir. Si desea que se vea exactamente igual para todos, debe convertirlo en una imagen.

Hay mucha gente que no escucha aquí, siento. @Daniel Sloof dijo todo el tiempo que preguntaba cómo, no si es una buena idea o no. IE es una mala idea, pero el hecho es que muchas personas todavía usan versiones anteriores y de esas personas me arriesgaría a suponer que el 90% ni siquiera sabe qué es Clear Type, estoy seguro que no hasta que empecé a depurar sitios. Ciertamente no saben cuán basura es su navegador. Si desea diseñar páginas que funcionen sin problemas y que se vean tan ingeniosas en IE como en Webkit, debe adoptar el extraño truco de vez en cuando, seguro que no es bonito, pero así es la vida. La mayoría de las personas estarán más influenciadas por un sitio bonito que un código bonito.

@capnhairdo se excita cuando dice acerca de @ font-face también. ¿Alguno de ustedes ha probado estas fuentes con Clear Type habilitado en IE7 y 8? Si lo hubiera hecho, se daría cuenta de que muchos se reproducen horriblemente, como lo que normalmente se obtendría con la CT deshabilitada, como una especie de derrota del objeto al seleccionar una fuente agradable en primer lugar y para muchos como Cufon y Sifr no son soluciones viables . Para algunos de nosotros está bien que las cosas se vean mediocres. Para mí no, mi sitio web vende mi imagen.

Cuando considera que incluso Apple está forzando la emulación de IE7 para IE8 en su sitio, debe enfatizar que la mayoría de las personas realmente no se ven afectadas por pequeñas desviaciones de la 'práctica recomendada', sino que notan mucho más un sitio que ofrece una estética estúpida y apenas es legible. ¡Eso no le hace ningún favor a nadie y es un problema que puede ocurrir con la TC activada! Me esfuerzo por lograr la mayor consistencia posible y no puedo dar una idea de las opciones que un usuario de IE debe y no debe tener en esa situación. Microsoft se llenó creando navegadores que intentaron desviarse de los estándares, que ellos mismos han lanzado hacks y soluciones para que tengamos que trabajar con ellos. Si eso significa aprovechar un error para solucionar un problema, ¡siempre que no afecte en gran medida el rendimiento, el ancho de banda o la usabilidad, simplemente hazlo! La vida es demasiado corta para meterse en torno a citar el cumplimiento estándar, respeto el código ordenado y la metodología estricta a un ideal, pero vamos, ustedes tienen tan bueno como dicen que la perfección no existe. Un buen diseño y construcción proviene de una perspectiva equilibrada. Aquí termina la diatriba :-P

Cleartype a veces parece estúpido en las soluciones basadas en JavaScript / AJAX, pero este tema es posible para responder a esa pregunta por qué algunas animaciones basadas en jQuery parecen estar rotas en IE ... así que la respuesta es que cuando JavaScript hace efecto de desvanecimiento con opacidad (opacidad a 0 desde 100 en 1 segundo de duración), luego se eliminan las fuentes de tipo cleartype del elemento que se desvanecen y la animación se ve muy mal.

por alguna razón elementos posicionados (cualquier cosa dentro de {position: relative}) - no está animado con una opacidad menor que 1.

Puede tener un filtro MS CSS en un elemento y aún habilitar ClearType en la fuente dentro. Simplemente agregue un elemento hijo y establezca su css " position " a "relativo" y ClearType no se desactiva. Copia lo siguiente y pruébalo.

<style>
#parent{
     background-color:white;
     filter:progid:DXImageTransform.Microsoft.Shadow(color=#000000,direction=180,strength=2);
     position:relative;
     border:solid 1px black;
     padding:10px;
     width:500px;
}
#child{
     position:relative; /*THIS SOLVED THE CLEARTYPE DISABLING PROBLEM IN BOTH IE7 & IE8*/ :)
}
</style>

<div id="parent">
     <div id="child">This text should always be smooth</div>
</div>
Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top