Maison > Article > interface Web > Que faire si CSS SVG ne s'affiche pas ?

Que faire si CSS SVG ne s'affiche pas ?

藏色散人original: 2021-01-04 10:48:005171parcourir

Solutions pour que CSS SVG ne s'affiche pas : 1. Utilisez la balise d8e2720730be5ddc9c2a3782839e8eb6 pour importer le fichier svg ; 2. Utilisez la balise 273238ce9338fbb04bee6997e5552b95 iframe> pour importer le document svg.

L'environnement d'exploitation de ce tutoriel : ordinateur Dell G3, système Windows 7, version HTML5&&CSS3.

Recommandé : "Tutoriel vidéo CSS"

Lorsque le HTML introduit des fichiers SVG mais qu'ils ne sont pas affichés, c'est peut-être parce que SVG n'est pas pris en charge par tous les navigateurs, Firefox, prise en charge de Chrome, c'est-à-dire que certaines versions inférieures ne le prennent pas en charge.

Solution :

Utiliser la balise d8e2720730be5ddc9c2a3782839e8eb6

d8e2720730be5ddc9c2a3782839e8eb6 Prend en charge et permet les scripts. [Recommandé : manuel html en ligne]

Remarque : L'utilisation de la balise d8e2720730be5ddc9c2a3782839e8eb6 lors de l'intégration de SVG dans une page HTML est la méthode recommandée par Adobe SVG Viewer ! Toutefois, si vous devez créer du XHTML valide, vous ne pouvez pas utiliser d8e2720730be5ddc9c2a3782839e8eb6. Il n'y a pas de balise d8e2720730be5ddc9c2a3782839e8eb6 dans aucune spécification HTML.

Par exemple : (vous devez télécharger le plug-in de visualisation SVG d'Adobe pour afficher)

<embed src="rect.svg" width="300" height="100" 
type="image/svg+xml"
pluginspage="http://www.adobe.com/svg/viewer/install/" />

Utilisez la balise 273238ce9338fbb04bee6997e5552b95 est le standard de la balise HTML 4, pris en charge par tous les navigateurs les plus récents. L'inconvénient est qu'il ne permet pas la création de scripts.

Remarque : si vous disposez de la dernière version d'Adobe SVG Viewer, les fichiers SVG ne fonctionneront pas lors de l'utilisation de la balise 273238ce9338fbb04bee6997e5552b95 (du moins pas dans IE) !

<object data="rect.svg" width="300" height="100" 
type="image/svg+xml"
codebase="http://www.adobe.com/svg/viewer/install/" />

Utilisez la balise d5ba1642137c3f32f4f4493ae923989c

d5ba1642137c3f32f4f4493ae923989c

Par exemple :

<iframe src="rect.svg" width="300" height="100"></iframe>

Ensuite dans rect.svg, en référençant l'espace de noms SVG, vous pouvez ajouter des éléments SVG au code HTML, comme ceci (cela nécessite un navigateur prenant en charge svg, tel que firefox, chrome) :

<html xmlns:svg="http://www.w3.org/2000/svg">
<body>
<p>This is an HTML paragraph</p>
<svg:svg width="300" height="100" version="1.1" >
<svg:circle cx="100" cy="50" r="40" stroke="black"
stroke-width="2" fill="red" />
</svg:svg>
</body>
</html>

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

html5 firefox css chrome css3 html xhtml Object 命名空间

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Comment écrire du code de centrage CSS Div pour les imagesArticle suivant：Comment écrire du code de centrage CSS Div pour les images

Articles Liés

Voir plus