Inicio>Tutorial de diseño web>Tutorial HTML

Algunas características nuevas del navegador Safari 4

Autor：Eve Cole Fecha de actualización：2025-05-15 01:48:01

En WWDC 2009, Apple lanzó la versión oficial de Safari 4 Browser. La versión oficial de Safari 4 dio la imitación de Chrome Tab y se restauró a la interfaz de la versión 3.0. Se dice que en WWDC, Serlet en serio Bsted Microsoft es el navegador IE8 y dijo que el motor JavaScript de Safari es actualmente el más rápido del mundo. Según los datos de prueba que proporciona, la velocidad de Chrome 2 es 5.3 veces mayor que la de IE8, mientras que la velocidad de Safari4 es 7.8 veces la de IE8.

La mayoría de estos datos son trucos oficiales, así que no nos preocupemos por ahora. Veamos qué impacto tendrá Safari4 en nuestro desarrollo front-end:

html 5

Admite etiquetas de audio y video.

CSS

Safari4 ha realizado muchas mejoras en el soporte de CSS, de la siguiente manera:

zoom

Safari 4 comienza a admitir los atributos de zoom. Este es el uso y el efecto del navegador IE. La diferencia es que si está zooming, Safari se encogerá a la fuente mínima admitida por el navegador, mientras que IE se encogerá directamente al tamaño del conjunto. Por ejemplo:

 .zoomTest {font-size: 12px; Zoom: 0.1}

Safari solo se encogerá al tamaño de la fuente de 9px, mientras que IE se encogerá a 1.2px (no se puede ver claramente a simple vista).

-Webkit-animación

Hay una serie de subpertíticas:

  • -webkit-animation-name especifique un nombre para la animación
  • -WebKit-animación duración de la animación
  • -El Método de conmutación de marco de animación de animación-animación-animación, es decir, los efectos de animación, probablemente incluyen facilidad, lineal, facilidad, facilidad y facilidad.
  • -Webkit-animation-loay Definir la hora de inicio de la animación
  • -Webkit-animation-iteration-conteo de repeticiones de animación
  • -WebKit-Animation-Direction La Direction tiene dos propiedades: Normal, Juego hacia adelante; Juego alternativo, alternativo, incluso delantero, Otra Reverse Play.

-WebKit-Mask

efecto de máscara/máscara de CSS

  • -WebKit-Mask-Aquitmento Dos valores: fijo y desplazamiento;
  • -WebKit-Mask-Clip El efecto de recorte de los bordes de elementos;
  • -WebKit-Mask-Position El uso es similar al atributo de posición de fondo.
  • -Webkit-Mask-Origin especifica el ancla del atributo -webkit-Mask-Position. Hay tres atributos: borde, contenido y relleno.
  • -WebKit-Mask-Image Element Mask Image, el valor es la ruta de la imagen;
  • -WebKit-Mask-Repeat Configuración repetitiva,
  • -WebKit-Mask-Composite Mix Styles. El valor predeterminado es el borde, lo que significa que el fondo se extiende al área fronteriza. También se puede configurar en relleno.

Otras mejoras

Safari4 también agrega o mejora el soporte de otros atributos CSS. Por ejemplo, la posición de fondo comienza a soportar los efectos de animación, por lo que no lo repetiré aquí.

Se puede ver que los nuevos atributos CSS agregados por Safari no son el contenido en el estándar W3C, pero los atributos privados de estos WebKits pueden permitirnos desarrollar mejores aplicaciones de red.

personaje de Wai-aria

Creo que no mucha gente sabe sobre Wai-Aria. Wai-aria significa Iniciativa de Accesibilidad web W3C Aplicaciones de Internet ricas en Internet, traducidas como aplicaciones de Internet ricas sin barreras en chino. Al mismo tiempo, W3C formuló estándares de rol de Wai-Aria. Google anunció no hace mucho tiempo que admitirá firmemente Wai-Aria, y la función de lectura de pantalla de su lector de Google se implementa a través de Wai-Aria. En la actualidad, Firefox ha comenzado a apoyar a Wai-Aria, e IE8 lo respalda parcialmente. Safari 4 también comenzó a apoyar el papel de Wai-Aria. Consulte el soporte de Safari 4 para Wai-Aria >>

Vale la pena señalar que Wai-Aria parece solo apoyar las etiquetas Div y Span. Para cooperar con Wai-Aria, Safari también agrega algunos atributos de soporte de HTML, como Aria Checked/Aria-Level/Aria-Valuemax/Aria-Valuemin, etc.

Descargar Safari:

PD: Este botón de descarga proviene de la página oficial de la descarga de Safari. Si tiene cuidado, encontrará que el estilo de este botón obviamente no es el estilo de Apple, sino más bien como el estilo del botón verde en la página de descarga de Firefox.

Artículos relacionados