Comment appliquer une feuille externe à a un div

Comment appliquer une feuille externe à a un div - HTML/CSS - Programmation

Marsh Posté le 09-09-2006 à 19:37:27    

Salut  
 
Je travaille sur une page qui en intègre d'autre. J'aimerais que les styles de mes pages et des pages externes ne se melangent pas.
 
Est t'il possible de faire ceci :
 

Code :
  1. <style>
  2. //style de ma page
  3. //style externe
  4. #externe {
  5. import(fichier.css);
  6. }
  7. </style>


 
 :??:

Reply

Marsh Posté le 09-09-2006 à 19:37:27   

Reply

Marsh Posté le 09-09-2006 à 20:16:26    

Non. Quand tu veux atteindre l'enfant d'un élement par exemple un lien enfant de #externe tu fais :
 
#externe a {
le style de ton lien
}

Reply

Marsh Posté le 10-09-2006 à 00:27:21    

tu mets 2 <link rel=...css>
 

Reply

Marsh Posté le 10-09-2006 à 14:22:29    

justement nargy le fait d'avoir 2 <link rel=...css/> provoque le melange des styles :D
 
Pour Cneo ta solution est etudiée mais elle implique que je me refasse toute la CSS externe et que je la modifie. Chose que j'aimerais eviter !
 
J'voulais juste savoir si il était possible d'appliquer une feuille CSS à un Bloc div uniquement.
 
 :jap:

Message cité 1 fois
Message édité par supermofo le 10-09-2006 à 14:25:22
Reply

Marsh Posté le 10-09-2006 à 14:50:10    

supermofo a écrit :

justement nargy le fait d'avoir 2 <link rel=...css/> provoque le melange des styles :D
 
Pour Cneo ta solution est etudiée mais elle implique que je me refasse toute la CSS externe et que je la modifie. Chose que j'aimerais eviter !
 
J'voulais juste savoir si il était possible d'appliquer une feuille CSS à un Bloc div uniquement.
 
 :jap:


Et je t'ai répondu non. :jap:

Reply

Marsh Posté le 10-09-2006 à 15:20:29    

Il reste en effet la solution de CNeo: entoure tes feuilles de style externe par:


#externe a {
// le reste de la feuille de style
}


Message édité par nargy le 10-09-2006 à 15:20:53
Reply

Marsh Posté le 10-09-2006 à 15:37:32    

ouais voici un extrait du code qui permet de faire ce que je souhaite
 

Code :
  1. function external_css($url){
  2. $css = file_get_contents($url);
  3. $pattern = "@^(\.|#)?([^{]*){$@";
  4. $replace = "#external" . $2;
  5. return "<style>". preg_replace($pattern,$replace,$css) ."</style>";
  6. }


 
Pis on insère dans le header HTML et c bouclé !
 
Mais la declaration des styles n'est pas du tout uniforme , donc ca pose plus de problemes que prévu.
 
J'laisse tomber  :(


Message édité par supermofo le 10-09-2006 à 15:41:55
Reply

Marsh Posté le 10-09-2006 à 15:57:03    

oulala machine à gaz!!
 
Pas besoin de toutes ces regex, tu ajoute juste une entête à tes feuilles de style, et un footer. Voir aussi la fonction http://php.net/fpassthru
 
De plus, insérer une feuille de style directement dans le code c'est pas malin. Ce que tu peut faire pour l'éviter, et par la même occasion utiliser le cache du navigateur des internautes, c'est de faire un fichier PHP de redirection (je suppose en effet que les feuilles de style externes sont sur un autre site). Voir http://php.net/header et notamment:
header('Content-type: text/css');

Reply

Marsh Posté le 10-09-2006 à 16:11:25    

J ' ai pas le choix !
 
Pour que tous les styles de la feuille externes s'applique unique au div #externe, j'ai absolument besoin de rajouter #externe devant chaque style.
 

Code :
  1. //avant
  2. .style_externe1{}
  3. .style_externe2{}
  4. .style_externen{}
  5. //apres
  6. #externe .style_externe1{}
  7. #externe .style_externe2{}
  8. #externe .style_externen{}


 
Et pour la mise en page  

Code :
  1. <html>
  2. <head>
  3. <link rel="stylesheet" href="css_interne.css" />
  4. </head>
  5. <body>
  6. <div id="interne"> contenu interne </div>
  7. <div id="externe"> contenu externe </div>
  8. </body>
  9. </html>


 
Edit: j'ai pige pourquoi tu me parles de header. Mais en fait il y a deux pages différentes sur une meme page ( un peu comme si je faisait un include d'une page complete dans une autre ).
Et forcement ca implique que les CSS de chacunes des pages font collision et ca donne des resultats parfois surprenant.
 
De meme je dois tuer le flash , javascript de la page externe et pour cela pas d'autre choix que les preg_replace  
 


Message édité par supermofo le 10-09-2006 à 16:16:03
Reply

Marsh Posté le 10-09-2006 à 16:31:20    

Code :
  1. //avant
  2.     .style_externe1{}
  3.     .style_externe2{}
  4.     .style_externen{}
  5.    
  6.     //apres
  7.     #externe {
  8.     .style_externe1{}
  9.     .style_externe2{}
  10.     .style_externen{}
  11.     }


Ceci dit tu aura peut être plus vite fait d'utiliser une frame.

Reply

Marsh Posté le 10-09-2006 à 16:31:20   

Reply

Marsh Posté le 10-09-2006 à 18:54:53    

Mais oui les frames, bien sur.
 
Complètement zappé merci !

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed