2010-10-10 6 views
0

J'ai un petit fichier CSS avec le contenu:CSS href vs différence en ligne stylesheet

<style type="text/css"> 

li { 
padding: 10px; 
font-family: Arial; 
} 

</style> 

Censé laisser un peu d'espace entre les éléments de la liste et changer la police. Si j'inclure ce fichier CSS dans le code HTML comme ci-dessous:

<link rel="stylesheet" href="./css/lists.css" type="text/css" /> 

il ne fonctionne pas :(

Cependant, si j'inclure le code CSS réelle à l'intérieur du html bloc « tête », il. travaux.

Je préfère vraiment CSS sourcing (si différents fichiers peuvent partager le code). Toute idée ce qui est erroné et comment résoudre?

Cordialement, JP

+0

@ JP19: Vous n'avez pas besoin d'espaces pour casser les étiquettes. Utilisez quatre espaces pour indenter chaque ligne de code. Ou, mettez en surbrillance vos blocs de code et appuyez sur Ctrl + K et l'éditeur les indent automatiquement pour vous. – BoltClock

+0

@BoltClock Fixe :) –

+0

@Stefan, @ JP19: J'ai annulé les modifications car je ne vois rien de changé dans la question sauf la note de bas de page. La mise en forme doit être complètement OK * et * syntaxiquement mise en évidence correctement maintenant. – BoltClock

Répondre

1

Vous êtes censé omettre les

<style type="text/css"> 

et

</style> 

balises de vos fichiers .css, comme ce sont des balises utilisées uniquement en HTML pour désigner les styles CSS si vous les inclure dans votre page <head>. Si vous les incluez, le navigateur tentera de les traiter comme du code CSS, ce qui n'est pas le cas, et cela ne fonctionnera pas pour votre feuille de style.

+0

Cela fonctionne! Merci! –

0

Vous ne devriez pas utiliser la balise script dans vos fichiers css. Juste li {..} est assez.

En outre, la vérification du chemin (./css/lists.css) peut s'avérer utile. Si elle a une erreur, rien ne sera inclus.

+0

Chemin était correct (une belle façon de vérifier est de visualiser la source dans le navigateur, puis cliquez sur le lien css href pour voir si son cassé). Cependant, comme vous l'avez souligné, le problème était l'étiquette supplémentaire. Supprimé et le script fonctionne maintenant :) –