Liste complète des raisons pour lesquelles un fichier css ne fonctionne pas

Ce problème est de me faire sentir comme un absolu noob.

Voici la tête de mon .fichier html:

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<link href="http://fakedomain.com/smilemachine/html.css" rel="stylesheet"/>
<title>Common Questions</title>
<script language="javascript">

function show(name) {
  document.getElementById(name).style.display = 'block';
}
</script>
</head>

Et mon html.le fichier css est en effet là où il devrait être. Mais je suis absolument aucun style que ce soit. À l'aide!

Et merci de ne pas voter tout simplement parce que la réponse est évidente et je ne peux pas le voir.

EDIT 1

Bon, alors maintenant, je suis juste essayer de résoudre le problème en local sur ma machine. Voici la tête:

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<link href="cover.css" rel="stylesheet" type="text/css"/>
<title>Common Questions</title>
<script language="javascript">
function show(name) {
  document.getElementById(name).style.display = 'block';
}
</script>
</head>

et maintenant le css:

BODY {
    font-size: 18pt; 
    color:#000fff;  
    font-family: Helvetica; 
    margin: 0 9 9 9;
}

table {
    font-size: 8pt; 
    color:#525252;  
    font-family: Helvetica; 
    margin: 0px;
    border-collapse: separate;
}

th {
    font-size: 10pt; 
    text-align: left;
    color:#550055;  
    font-family: Helvetica; 
    border-color: #999;
    border-width: 0 0 1px 0;
    border-style: dotted;
}

td {
    font-size: 10pt; 
    text-align: left;
    color:#550055;  
    font-family: Helvetica; 
    border-color: #999;
    border-width: 0 0 1px 0;
    border-style: dotted;
}

.left {
    display:inline-block;
    font-size: 10pt; 
    color:#990055;  
    font-family: Helvetica; 
    margin: 0 0 5 0;
}

.right {
    display:inline-block;
    font-size: 18pt; 
    font-weight: bold;
    float: right;
    color:#525252;  
    font-family: Helvetica; 
    margin: 0px;
}

.question {
    display:inline-block;
    font-size: 18pt; 
    font-weight: bold;
    float: right;
    color:#B452CD;  
    font-family: Helvetica; 
    margin: 0px;
}

EDIT 2

Bon j'ai fait quelques progrès. Firebug suggestion était vraiment bon. J'ai vu que le lien vers le fichier CSS est en cours de lecture comme des caractères Chinois. C'était l'encodage UTF problème donc je viens d'ouvrir mes fichiers dans un éditeur de texte, puis enregistré en UTF-16.

Mais maintenant, c'est la lecture de la mal de données à partir du fichier css! J'ai téléchargé le fichier css ci-dessous, mais dans firebug elle montre un deux liner.

Je trouve cela déroutant!

Cela peut ne pas aider. Mais est-il une raison pourquoi vous êtes en utilisant une URL de votre fichier css? Pourquoi ne pas simplement utiliser /smilemachine/html.css?
Je viens de penser à une url absolue serait plus d'une chose sûre. Comme il serait garanti pour fonctionner.
C'est plutôt l'inverse 😉 Une URL relative travaillera en plus de cas.
Une faute de frappe dans votre css sera également le faire 😉

OriginalL'auteur Eric Brotto | 2011-08-04

  1. 20

    1. Êtes-vous sûr que la feuille de style en est chargé? Vous pouvez le voir à l'aide de l'onglet "Net" de Firebug sur firefox, ni sur l'onglet "Réseau" de la Console de votre navigateur.

    2. (Si 1 œuvres) peut-on avoir un exemple simple de style et de voir si cela est arriver appliquée (et visible dans la console)?

    Accepté pour la même raison (Firebug suggestion 🙂

    OriginalL'auteur Nivas

  2. 6

    Essayer:

    <link type="text/css" rel="stylesheet" href="http://fakedomain.com/smilemachine/html.css" />

    Si cela ne fonctionne pas non plus, alors assurez-vous que l'URL est accessible, et le contenu est ce que vous cherchez.

    Ma conjecture est que sur les disparus type="text/css" dans l'échantillon.
    Inséré et cela ne fonctionne toujours pas 🙁
    Brotto: Êtes-vous sûr que le contenu du fichier css sont chargés correctement, et pas foiré à cause de certains de la règle de réécriture. Pouvez-vous intervenir avec Firebug pour inspecter le contenu de chargé fichier CSS? Peut-on voir un exemple de cela, afin que nous puissions debug mains sur la question?
    Brotto: Il n'est pas nécessaire de sauvegarder votre fichier UTF-16, UTF-8 est fine et recommandé. Je ne vois pas où est le problème dans le lien fourni. Dans votre question que vous posez sur un fichier css externe, mais dans le lien que vous avez utilisé du css. Alors, quel est le problème maintenant?
    En fait, ignorer que peu sur le javascript. Je pense vraiment que tout ce qui a à voir avec le codage UTF.

    OriginalL'auteur Shef

  3. 4

    Pourrait-il être que vous avez une erreur dans votre fichier CSS? Une parenthèse gauche ouverte, un point-virgule manquant etc?

    C'était mon problème. Fixer le fichier css a fait la différence.

    OriginalL'auteur brezanac

  4. 3

    Copier le fichier css de l'url et la coller dans votre navigateur. Si il ne charge pas le fichier que vous connaissez le problème est dans l'url.

    Fait. Le fichier a été bien chargé. Bonne suggestion!
    En fait à la fin, il y a un problème là. Lorsque j'ai regardé avec Firebug, j'ai vu que le lien était à venir comme les caractères Chinois :(. Voir mon EDIT 2.

    OriginalL'auteur JanL

  5. 3

    J'ai eu le même problème - j'ai changé mon texte le codage UTF-16 sur mon fichier d'index et de mon fichier css ne serait vide quand je l'avais essayer de charger la page dans le navigateur. J'ai compris par beaucoup d'essais et d'erreurs que vos fichiers html et css doivent avoir le même encodage! Je ne sais pas si ce serait travailler pour vous, mais il l'a fait pour moi.

    Merci, votre réponse a aidé. J'ai eu le même problème: le fichier html en quelque sorte codé en UTF-16 et le CSS/JS fichiers en UTF-8...

    OriginalL'auteur Whitney

  6. 3

    Firefox peut rejeter une feuille de style s'il n'est pas servi avec un contenu de type "text/css". (Ceci est distinct de la 'type="text/css"' déclaration dans le code HTML.)

    OriginalL'auteur Matthew Wilson

  7. 2

    J'feuille de style peut ne pas se charger, pour plusieurs raisons. Mais la principale approche pour résoudre ce problème est comme suit:

    1. Après le chargement de la page, appuyez sur F12 pour ouvrir les Développeurs de la Console. Vérifiez la console pour les erreurs consignées.

    2. Ensuite, vous devriez vérifier la feuille de style de l'onglet et afficher la liste des feuilles de style du navigateur chargé.

    3. L'URL que vous utilisez à l'intérieur de votre HTML link balise peut être unaccessable, manuellement, essayez de visiter la feuille de style avec un navigateur et de voir si tout s'affiche correctement.

    4. Toute faute de frappe à l'intérieur de votre code HTML ou CSS feuille de style peut provoquer la feuille de style à partir de chargement.

    5. rechercher toutes les occurrences d'erreurs fatales avant votre <link> tag. Une erreur fatale peut arrêter l'exécution du code et de suspendre la page, ce qui n'inclut pas votre feuille de style.

    Espère que ça aide.

    OriginalL'auteur Abraar Arique Diganto

  8. 1

    Je ne pense pas que le problème réside dans l'échantillon que vous avez posté, - nous aurions besoin de voir le CSS, ou de vérifier son emplacement, etc!

    Mais pourquoi ne pas essayer à la déshabiller à une règle CSS - le mettre dans la section d'en-TÊTE, puis si ça marche, déplacer la règle vers le fichier externe. Puis re-présenter les autres règles pour s'assurer il n'y a rien de manquant ou de prendre la priorité sur votre CSS.

    OriginalL'auteur Widor

  9. 1

    J'ai eu un problème de ce genre! J'ai été en mesure de le réparer en suivant

    L'étape 1>>à partir de Abraar Arique post, je suis allé dans la console>> est Allé en vertu de l'Éditeur de Style et trouvé Firefox n'était pas le chargement de la mise à jour de la copie de mon fichier css.

    J'ai effacé tous de l'histoire et de recharger la page, puis mon problème a été résolu.

    OriginalL'auteur Dwain Beckford

  10. 1

    J'ai été confrontée au même problème, mais la raison a été le style dans le css est enveloppé dans un ID qui n'est pas exister

    #navi ul{
    color: red;
}

    la #navi sélecteur est nulle part dans le code HTML car j'ai oublié de l'ajouter avant d'écrire le CSS.
    dans mon cas, j'ai travaillé avec Moins de fichiers, donc je imbriqués comme ça

    #navi{
    ul{
       color:red;
   }
}

    J'espère que cela contribuera à re-vérifier quand les choses ne fonctionnent pas

    OriginalL'auteur Y. Arifin

  11. 1

    Nouvelle pour vous les Gars !

    Au cours de ma Gorgée minification du processus de

    <!-- build:css /css/project-mini.css -->
    <link rel="stylesheet" href="css/main.css"/>
    <link rel="stylesheet" href="css/splash.css"/>
    <link rel="stylesheet" href="css/header.css"/>
    <link rel="stylesheet" href="css/print.css" media="print"/>
<!-- endbuild -->

    Dernier fichier CSS a été pour l'impression et la sortie générée m'a donné 

        <link rel="stylesheet" href="css/project-mini.css" media="print"/>

    À cause de media="print" toutes les règles CSS ont été ignorés !

    OriginalL'auteur hugsbrugs

  12. 0

    L'URL http://fakedomain.com/smilemachine/html.css dans votre <link> Balise est mal. Fichier non Trouvé.

    C'est parce que c'est pas mon vrai nom de domaine!
    Oui je sais il est un faux, mais dans votre fichier est manquant, c'est le problème
    Non, il n'est pas. Il utilise l'URL réelle dans son code, duh!

    OriginalL'auteur Ahsan Rathod

  13. 0

    Si votre URL est de travail et charge le fichier correctement, et vous avez dit que l'ajout de la bonne

    <link type="text/css" href="yourlink.css">

    code ne résout pas le problème, alors la seule autre problème, c'est que c'est une erreur dans le réel .fichier css. Et de vous conseiller sur ce, nous aurions besoin de voir le fichier.

    Ce que vous pouvez faire est d'écrire une base <div> balise dans votre code HTML, ajoutez à la base de la règle CSS dans votre fichier existant, puis voir si vous pouvez influencer ce tag avec votre nouvelle règle CSS.

    OriginalL'auteur Liam

  14. 0

    J'ai eu le même problème, les caractères chinois ont été figurant dans firefox lors du téléchargement vers le serveur web, mais pas sur localhost. J'ai copié le contenu du fichier css dans un nouveau fichier texte. Tout fonctionne à présent. Doit avoir été un unicode/erreur de codage d'une certaine sorte.

    OriginalL'auteur James Pitt

  15. 0

    Mon simple pensez que vous avez manqué type="text/css".

    Je l'ai mis et toujours pas d'offres :(. Mais bonne suggestion.

    OriginalL'auteur anglimasS

  16. 0

    J'ai eu le même problème avec le css ne figurant pas au travail, j'ai appris plus tard que c'était mon @media lignes dans le css qui ont été à l'origine du problème.

    J'ai déménagé à la fin de la css et tout a été résolu.

    OriginalL'auteur Chunky

  17. 0

    J'en ai une autre. J'ai nommé mon fichier css: par défaut.css. Il ne serait pas charge. Quand j'ai essayé de l'afficher dans le navigateur, il a montré une page vide.

    J'ai changé le nom de default_css.css et il a commencé à travailler.

    OriginalL'auteur mikekehrli