2010-06-03 7 views
0
<head> 

    <title>Water Bureau</title> 
    <link rel="shortcut icon" href="/favicon.ico" /> 
    <link rel="stylesheet" href="/css/main.css" type="text/css" media="screen" title="Main CSS"> 
    <link rel="stylesheet" href="custom.css" type="text/css" media="screen" title="Custom Styles"> 
    <script language="JavaScript" src="/shared/js/createWin.js" type="text/javascript"></script> 

</head> 

C'est le code, mais le "custom.css" ne fonctionne pas. Ça ne marche pas du tout. Si nous ajoutons un @import dans main.css OU dans l'en-tête au lieu d'un, cela fonctionne bien. Des idées? Nous avons également éliminé les "écrans" des médias sur les deux.Deux fichiers CSS liés ne fonctionnent pas

Le CSS à l'intérieur fonctionne très bien, c'est juste quand nous empilons ces deux, le premier analysé est le seul lu par le navigateur. Donc, si nous échangeons principal ci-dessous personnalisé, personnalisé que fonctionne mais AUCUNE des œuvres principales. et la coutume a juste l'extrait de CSS, et ne surcharge pas tout le CSS dans main, juste 1 élément.

Je n'arrive pas à comprendre! Nous avons d'autres feuilles de style ées dans la tête (que nous avons pris pour essayer de résoudre ce problème) et ils ont travaillé très bien ...

Répondre

1

Comme hsource, essayez de valider les deux fichiers css.

http://jigsaw.w3.org/css-validator/

juste essayer aussi cela, sans cette chose de titre avec les deux fichiers CSS dans le même dossier, à la fois par rapport à la page qui les importe:

<link rel="stylesheet" type="text/css" href="css/main.css" media="screen" /> 
<link rel="stylesheet" type="text/css" href="css/custom.css" media="screen" /> 

Il pourrait aussi être que parce que vous n'utilisez pas de doctype et vous ne fermez pas vos balises de lien, quelque chose lié à cela pourrait être votre problème. Donc, essayez ceci:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US"> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
    <title></title> 
    <link rel="stylesheet" type="text/css" href="css/main.css" media="screen" /> 
    <link rel="stylesheet" type="text/css" href="css/custom.css" media="screen" /> 
</head> 
+0

Merci, la chose DOCTYPE a fonctionné :) son étrange ... je ne peux pas croire que personne n'a mentionné cela pour la spécification HTML5. Nous utilisions pour HTML5, mais le changement semblait fonctionner. –

1

Il y a un deux endroits que je pense peut-être le problème:

  1. Le href pour custom.css pointe actuellement vers un emplacement dans le répertoire courant du fichier HTML. Si custom.css est dans le répertoire/css comme main.css, vous devrez l'ajouter. Le fichier est inclus lorsque vous utilisez une balise @import parce que le @import est par rapport à main.css, et il peut trouver custom.css dans le même répertoire que main.css

  2. Il y a une balise CSS ou non fermé quelque chose qui casse tous les CSS viennent après; C'est assez improbable, mais vous pouvez vérifier votre CSS avec le W3.org CSS validator.

0

Cela peut être dû à la façon dont CSS gère style precedence, mais pourrait tout aussi bien être causé par un mauvais balisage. Essayez de valider votre document ou d'utiliser un chemin absolu pour la feuille de style custom.css.

0

GaVra, vous aviez raison sur le doctype, etc. Nous aurions dû savoir que, compte tenu de la doctype HTML5 a été utilisé et est probablement pas tout à fait prêt à l'action.

Merci!

Questions connexes