Jump to content

Du CSS dans PHP


Conan28

Recommended Posts

Alors je vous explique

lors de ma création du site je rencontrre un gros gros soucis

le css ne veux pas s'apilliquer dans du php????

hors ça m'interesse de faire mon css mais d'avoirs des includes je me suis chargé des includes

Un paint screen pour vous aider quand même

informachinoisdp9.th.jpg

Voila vous êtes servi de mon aide

Link to comment
Share on other sites

Biensur que si les css sont pris en compte par le php. Enfin je m'explique.

Tu as deux fichier : ta feuille de style (ou tes feuilles de styles) , par exemple "style.css"

Et ton fichier php : page.php

Dans le head de ton php tu apelles ton css : <link rel="stylesheet" type="text/css" href="style.css"/>

Ensuite lorsque tu vas sur ta page php, le serveur en amont génère du html (principe du php) et ton css est appliqué à la page HTML généré comme si ta page était statique

Link to comment
Share on other sites

Index.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
	<title>Informachinois</title>
	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
	<link rel="stylesheet" media="screen" type="text/css" title="LOOK" href="Styles/look.css" />
</head>

<body>
<div id="haut">
</div>

<div id="menu">
<?php
// Puis on inclue le menu
include("menu.html");
?>
</div>
<div id="corps">:'(</div>
<?php
include("pied.html")
?>
</body>
</html>

Menu.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
	<title></title>
	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
	<link rel="stylesheet" media="screen" type="text/css" title="LOOK" href="Styles/look.css" />
</head>

<body>
<div id="menu">

  <div class="element_menu">
   <h3>Titre menu</h3>
   <ul>
	   <li><a href="page1.html">Lien</a></li>
	   <li><a href="page2.html">Lien</a></li>
	   <li><a href="page3.html">Lien</a></li>
   </ul>
  </div>

  <div class="element_menu">
   <h3>Titre menu</h3>
   <ul>
	   <li><a href="page4.html">Lien</a></li>
	   <li><a href="page5.html">Lien</a></li>
	   <li><a href="page6.html">Lien</a></li>
   </ul>
  </div>
</body>
</html>

Pied.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
	<title></title>
	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>

<body>
<div id="pied_de_page">
<p>© Conan corporaition Tout droits réservé a l'auteur</p>
</div>
</body>
</html>

look.css

body {
width : 600px; 
margin : auto; 
margin-top : 20px; 
margin-bottom : 20px; 
background-image : url("degrade.jpg"); 
} 
#en_tete {
width : 600px; 
height : 196px; 
background-image : url("header.jpg"); 
background-repeat : no-repeat; 
margin-bottom : 10px; 
} 
#menu {
float : left; 
width : 120px; 
color : #08b3f6; 
font-family : Arial, "Trebuchet MS", Verdana, "Comic Sans MS", sans-serif; 
background-color : yellow; 
} 
.element_menu {
background-color : blue; 
border : 4px outset yellow; 
margin-bottom : 20px; 
background-image : url("motif.jpg"); 
background-repeat : repeat-x; 
color : #03c1fd; 
} 
.element_menu h3 {
color : #03c1fd; 
text-align : center; 
background-color : blue; 
} 
.element_menu ul {
list-style-image : url("lien.gif"); 
padding : 0; 
padding-left : 40px; 
margin : 0; 
margin-bottom : 5px; 
} 
.element_menu a
{
color : #f9c307; 
background-color : #065ff7; 
}
.element_menu a:hover
{
color:#065ff7;
background-color:#f9c307;
text-decoration:blink;
}
#corps
{
  margin-left: 140px;
  margin-bottom: 20px;
  padding: 5px;

  color: #03c1fd;
  background-color: blue;
  background-image: url("motif.jpg");
  background-repeat: repeat-x;

  border: 4px outset yellow;
}
#pied_de_page
{
  padding: 5px;
  margin-left: 140px;

  text-align: center;

  color:#03c1fd;
  background-color: blue;
  background-image: url("images/motif.png");
  background-repeat: repeat-x;

  border: 4px inset yellow;
}

Link to comment
Share on other sites

Quand tu fais des include, celà ne sert à rien de répéter tout tes dtd et balise html et compagnie. Le mieux aussi c'est de faire des inculde de fichier php. En gros tes fichier devrait être :

index.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
	<title>Informachinois</title>
	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
	<link rel="stylesheet" media="screen" type="text/css" title="LOOK" href="Styles/look.css" />
</head>

<body>
<div id="haut">
</div>

<div id="menu">
<?php
// Puis on inclue le menu
include("menu.php");
?>
</div>
<div id="corps">:'(</div>
<?php
include("pied.php")
?>
</body>
</html>

menu.php

<div id="menu">

  <div class="element_menu">
   <h3>Titre menu</h3>
   <ul>
	   <li><a href="page1.html">Lien</a></li>
	   <li><a href="page2.html">Lien</a></li>
	   <li><a href="page3.html">Lien</a></li>
   </ul>
  </div>

  <div class="element_menu">
   <h3>Titre menu</h3>
   <ul>
	   <li><a href="page4.html">Lien</a></li>
	   <li><a href="page5.html">Lien</a></li>
	   <li><a href="page6.html">Lien</a></li>
   </ul>
  </div>

pied.php

<div id="pied_de_page">
<p>© Conan corporaition Tout droits réservé a l'auteur</p>
</div>

Essayes ça sera correcte au niveau des include (car là ce que tu avais fait ne veut plus rien dire pour le navigateur)

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...