Maison  >  Article  >  interface Web  >  Partagez une solution rapide aux caractères tronqués causés par l'encodage de caractères CSS

Partagez une solution rapide aux caractères tronqués causés par l'encodage de caractères CSS

高洛峰
高洛峰original
2017-03-09 18:08:321478parcourir

L'éditeur suivant vous proposera un article pour partager une solution rapide aux caractères tronqués causés par l'encodage de caractères CSS. L'éditeur le trouve plutôt bon, je vais donc le partager avec vous maintenant et le donner comme référence pour tout le monde. Suivons l'éditeur pour y jeter un œil

Le principe de l'échec CSS provoqué par des caractères tronqués :

Puisqu'un caractère chinois est composé de deux caractères, la "re" combinaison de caractères se produira lorsque le codage est incohérent. , (la combinaison du caractère codé d'un demi-caractère chinois et des caractères suivants pour générer un nouveau "texte") provoque la conformité de la fin d'origine à la "mutation", ce qui fait que le symbole de fin n'est pas trouvé. , rendant le CSS suivant invalide.

Conseil 1 : Les caractères tronqués qui apparaissent en CSS sont causés par l'incohérence entre l'encodage des caractères CSS et l'encodage des caractères de la page, le moyen le plus direct est donc de rendre l'encodage des caractères cohérent. Spécifiez le type d'encodage CSS, par exemple : @charset "utf-8" ; (Le type d'encodage spécifié est utf-8, qui doit être écrit sur la première ligne du fichier CSS)

Astuce 2 : Les caractères tronqués apparaissant dans CSS sont tous causés par des caractères chinois, donc tant que vous n'écrivez pas chinois, il n'y aura pas de situation de "caractères tronqués provoquant un échec CSS"

Mis à part les deux conseils ci-dessus, quand si nous creusons plus profondément, nous constaterons que « les personnages tronqués proviennent généralement des deux situations suivantes.

1. Les commentaires chinois provoquent un code tronqué

Les commentaires CSS sont : /*certains commentaires*/

exemple de code tronqué :
code normal : /*trois caractères chinois */ Caractères tronqués causés par
 : /*涓夋眽瀛?/
Environnement du navigateur : IE6
HTML : gb2312
CSS : aucun encodage spécifié, l'analyse réelle est utf-8

Dans l'exemple ci-dessus, le code tronqué bloque le caractère de fin du commentaire CSS, de sorte que le contenu CSS suivant se trouve dans la plage du commentaire, ce qui rend le CSS invalide.
Mesures préventives : renforcer les commentaires

.

Exemple :
Code normal :/****Trois caractères chinois****/
Caractères tronqués causés par : /****Juan 狋罽瀛?***/
Cette version améliorée des commentaires peut empêcher les caractères tronqués de "muter". " le dernier caractère de fin du commentaire, et peut être utilisé lors de l'écriture de CSS. Prenez des précautions à l'avance

2. Les polices chinoises provoquent des codes tronqués
Police spécifiée par CSS : font-family : "Police chinoise" ;

Exemple de code tronqué :
Code normal : font-family : Caractères tronqués causés par "Hellbody"
 : font-family:"翜涋"
Environnement du navigateur : IE6
HTML : gb2312
CSS : aucun encodage spécifié, en fait analysé en utf-8

Dans l'exemple ci-dessus, le nom de la police devient tronqué, ce qui rend la police spécifiée invalide. Les conséquences de ce problème ne semblent pas très graves, mais dans des situations réelles, il existe effectivement une situation où les caractères tronqués "muent" les guillemets suivants, de sorte que le CSS suivant est dans les guillemets de la police, donc que tous les CSS suivants deviennent invalides.
Mesures de précaution : utilisez des alias de police (afin que les navigateurs puissent les reconnaître)

Exemple :
Code normal : font-family : "SimHei" (font-family : "9ed14f53" )
Navigateur analyse : font-family : "SimHei" (font-family : "Hei", IE6 est toujours font-family : "9ed14f53" mais l'analyse des polices le montre comme Hei)
Utilisez des alias pour éviter d'utiliser le chinois, afin de évitez les caractères tronqués

Liste des polices chinoises CSS (famille de polices)

Certains Windows :

Helvetica : SimHei

Dynastie des chansons : SimSun

Nouvelle Song Dynasty: nsimsun

fangsong: fangsong

kaiti: kaiti

fangsong_gb2312: fangsong_gb2312

kaiti_gb2312: kaiti_gb2312 Microsoft YaHei : Microsoft YaHei

Certains de ceux qui sortiront après l'installation d'Office :

Script officiel : LiSu

Youyuan : YouYuan

Chinois bien noir : STXihei

Script régulier chinois : STKaiti

Script de chanson chinoise : STSong

Script de chanson chinoise : STZhongsong

Script de chanson d'imitation chinoise : STFangsong

Fondateur Shu Ti : FZShuTi

Fondateur Yaoti : FZYaoti

Caiyun chinois : STCaiyun

Ambre chinoise : STHupo

Script officiel chinois : STLiti

Script régulier chinois : STXingkai

Nouveau Wei chinois : STXinwei

Supplément :

Après avoir utilisé le script régulier_GB2312 et l'imitation Song Dynasty_GB2312, cela peut ne pas fonctionner sous Windows 7/Vista/2008 Affichez ensuite la police correspondante.

C'est parce que Windows 7/Vista/2008 a Kai Ti et Fang Song, mais par défaut il n'y a pas de Kai Ti _GB2312 et Fang Song _GB2312, et la différence de nom de police est "_GB2312".

------------------------------------------------------ ------ ---------------

Comment écrire des polices chinoises en CSS

Quant à comment écrire des polices, je pense que doit être expliqué :

corps,

bouton, saisie, sélection, zone de texte {

police : 12px/1 Tahoma, Helvetica, Arial, "5b8b4f53", sans- serif;

}

« 5b8b4f53 » est « Arial ». Utilisez Unicode au lieu de SimSun car certaines versions de Firefox et Opera ne prennent pas en charge la méthode d'écriture SimSun. Vulgariser la connaissance des polices :

Alias ​​de police

Une police dans le système est autorisée à avoir plusieurs alias. Par exemple, sous Windows, Georgia peut également s'appeler Georgia MS. Il s'agit en fait de la même police. Le nom officiel de la dynastie Song est SimSun, et « Song Dynasty » n'est que son surnom.

Selon la spécification, le navigateur devrait être capable de reconnaître automatiquement l'alias de la police et de le mapper au bon fichier de police. Par exemple, font-famliy: SimSun et font-family: "宋体" devraient avoir des effets équivalents. Malheureusement, il semble que de nombreux navigateurs ne puissent pas implémenter correctement la définition précédente...

Par conséquent, compte tenu de la compatibilité des navigateurs, nous devons utiliser "Songti", et le transcodage sous forme Unicode peut garantir qu'il n'y aura aucun problème dans tout encodage.

-------------------------------------------------------------- -- ------------

Afin de faciliter une utilisation rapide par les amis qui en ont besoin, le tableau suivant répertorie les encodages Unicode de certaines polices chinoises couramment utilisées :
Helvetica 9ED14F53
Songti 5B8B4F53
Kaitai 69774F53
Microsoft Yahei 5FAE8F6F96C59ED1


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!

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