Page d'accueil>Tutoriel de conception de sites Web>Tutoriel HTML

Quelques nouvelles fonctionnalités du navigateur Safari 4

Auteur：Eve Cole Date de mise à jour：2025-05-15 01:48:01

Sur WWDC 2009, Apple a publié la version officielle du navigateur Safari 4. La version officielle de Safari 4 a renoncé à l'imitation de l'onglet Chrome et restauré à l'interface de la version 3.0. On dit que sur WWDC, Serlet a sérieusement bsted le navigateur IE8 de Microsoft et a dit que le moteur JavaScript de Safari est actuellement le plus rapide au monde. Selon les données de test qu'il fournit, la vitesse de Chrome 2 est de 5,3 fois celle de IE8, tandis que la vitesse de Safari4 est de 7,8 fois celle de IE8!

La plupart de ces données sont des gadgets officiels, alors ne nous en préoccupons pas pour l'instant. Voyons quel impact Safari4 aura sur notre développement frontal:

html 5

Prise en charge des balises audio et vidéo.

CSS

Safari4 a apporté de nombreuses améliorations au support CSS, comme suit:

zoom

Safari 4 commence à prendre en charge les attributs de zoom. C'est l'utilisation et l'effet du navigateur IE. La différence est que si elle est zoom, Safari se rétrécira à la police minimale prise en charge par le navigateur, tandis que IE se rétrécira directement à la taille de l'ensemble. Par exemple:

 .zoomTest {Font-Size: 12px; Zoom: 0,1}

Safari ne rétrécira que la taille de la police de 9px, tandis que IE se rétrécira à 1,2px (il ne peut pas être vu clairement à l'œil nu).

-webkit-animation

Il y a une série de sous-propriétés:

  • -Webkit-animation-name Spécifiez un nom pour l'animation
  • -Webkit-animation-durée de durée d'animation
  • -Webkit-Animation-Timing-Function Animation Frame Méthode, c'est-à-dire les effets d'animation, incluent probablement la facilité, la linéaire, la facilité, la facilité de sortie et la facilité de sortie.
  • -Webkit-animation-dislay définir l'heure de début de l'animation
  • -Webkit-animation-iteration-Count-animation répétitions
  • -Webkit-Animation-Direction La direction d'animation a deux propriétés: le jeu normal, avant; Alternate, alternative, même avantage avant, jeu inversé étrange.

-Webkit-mask

Effet CSS Mask / Mask

  • -Webkit-mask-Attachement deux valeurs: fixe et défilent;
  • -Webkit-mask-Clip L'effet d'écrêtage des bordures des éléments;
  • -Webkit-mask position L'utilisation est similaire à l'attribut de position d'arrière-plan.
  • -Webkit-mask-origin spécifie l'ancre de l'attribut -webkit mask-mask. Il y a trois attributs: la bordure, le contenu et le rembourrage.
  • -Webkit-mask-image Element Mask Image, la valeur est le chemin d'image;
  • -Webkit-mask-répétitiel paramètres,
  • -Webkit-mask-composite de styles de mixage. La valeur par défaut est la frontière, ce qui signifie que l'arrière-plan s'étend à la zone frontalière. Il peut également être réglé sur le rembourrage.

Autres améliorations

Safari4 ajoute ou améliore également le support d'autres attributs CSS. Par exemple, la position d'arrière-plan commence à prendre en charge les effets d'animation, donc je ne le répéterai pas ici.

On peut voir que les nouveaux attributs CSS ajoutés par Safari ne sont pas le contenu de la norme W3C, mais les attributs privés de ces webkits peuvent en effet nous permettre de développer de meilleures applications réseau.

personnage wai-aria

Je crois que peu de gens connaissent Wai-Aria. Wai-Aria signifie W3C Web Accessibility Initiative Rich Internet Applications, traduite par des applications Internet riches sans barrière en chinois. Dans le même temps, W3C a formulé les normes de rôle WAI-Aria. Google a annoncé il n'y a pas longtemps qu'il prendrait en charge fortement Wai-Aria, et la fonction de lecture d'écran de Google Reader est implémentée via Wai-Aria. À l'heure actuelle, Firefox a commencé à soutenir Wai-Aria, et IE8 le soutient partiellement. Safari 4 a également commencé à soutenir le rôle Wai-Aria. Découvrez le soutien de Safari 4 pour Wai-Aria >>

Il convient de noter que Wai-Aria semble ne soutenir que les étiquettes DIV et Span. Afin de coopérer avec Wai-Aria, Safari ajoute également certains attributs de support de HTML, tels que Aria-Coched / Aria-Level / Aria-Valumax / Aria-Valuemin, etc.

Télécharger Safari:

PS: Ce bouton de téléchargement provient de la page officielle du téléchargement de Safari. Si vous faites attention, vous constaterez que le style de ce bouton n'est évidemment pas le style d'Apple, mais plus comme le style du bouton vert sur la page de téléchargement de Firefox.

Articles connexes