A voir également:
- Création des sites web
- Création site web - Guide
- Instagram web - Guide
- Traduire une page web - Guide
- Creation compte gmail - Guide
- Création organigramme - Guide
5 réponses
C'est ton code (CSS3) que tu doit adapter pour les trois navigateur (par exemple pour le placement utilse les % plutot que les pixel etc. ) je crois en tout cas
ThEBiShOp
Messages postés
8378
Date d'inscription
jeudi 22 mars 2007
Statut
Contributeur
Dernière intervention
8 février 2021
1 565
3 juil. 2013 à 12:51
3 juil. 2013 à 12:51
Salut,
Tu l'as créé avec quoi ton site web ? Tu utilises quel techno ? PHP ? HTML ? Tu utilises un serveur web ? Si oui, sur windows ou un serveur mutualisé/dédié ?
Va falloir donner des infos parce que là ma boule de cristal est en révision....
Tu l'as créé avec quoi ton site web ? Tu utilises quel techno ? PHP ? HTML ? Tu utilises un serveur web ? Si oui, sur windows ou un serveur mutualisé/dédié ?
Va falloir donner des infos parce que là ma boule de cristal est en révision....
j'utilise HTML5 et CSS3, je compile tout simplement sur ces trois navigateur sur mon windows XP
ThEBiShOp
Messages postés
8378
Date d'inscription
jeudi 22 mars 2007
Statut
Contributeur
Dernière intervention
8 février 2021
1 565
3 juil. 2013 à 14:20
3 juil. 2013 à 14:20
il n'y a pas de compilation en html
pour faire une page html, il suffit de créer un fichier vide ayant pour extension .html et d'y mettre du code html
Et ça fonctionne obligatoirement sur n'importe quel navigateur.
pour faire une page html, il suffit de créer un fichier vide ayant pour extension .html et d'y mettre du code html
Et ça fonctionne obligatoirement sur n'importe quel navigateur.
ça ne fonctionne pas pareil sur tous les trois navigateurs
Pierrecastor
Messages postés
41466
Date d'inscription
mercredi 5 novembre 2003
Statut
Modérateur
Dernière intervention
5 avril 2024
4 129
3 juil. 2013 à 15:11
3 juil. 2013 à 15:11
Salut
Effectivement, ca ne fonctionne pas pareille sur les trois navigateur, c'est pour ça qu'il faut tester sur les principaux du marcher pour que le site sois compatible avec le maximume de personne. (IE 7, 8 et9, Firefox, opera, safari, etc).
Mais si tu nous disait comment tu développe ton site, ça pourrait nous aider à te répondre. :-)
Effectivement, ca ne fonctionne pas pareille sur les trois navigateur, c'est pour ça qu'il faut tester sur les principaux du marcher pour que le site sois compatible avec le maximume de personne. (IE 7, 8 et9, Firefox, opera, safari, etc).
Mais si tu nous disait comment tu développe ton site, ça pourrait nous aider à te répondre. :-)
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Je le développe à l'aide du tutoriel du site du zèro, j'ai fait un site web pour m'exercer voilà le code:
<!DOCTYPE>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style>
body
{
background-color: #cccccc;
background:" url('image/shoot.png')";
font-family: 'Trebuchet MS', Arial, sans-serif;
color:"";
}
@media all and (max-width: 1024px)
{
#bloc_page
{
width: auto;
margin: auto;
}
}
section h1, footer h1, nav a
{
font-family: Dayrom, serif;
font-weight: normal;
text-transform: uppercase;
}
header
{
background: url('images/ime.png') repeat-x bottom;
}
#titre_principal
{
display: inline-block;
}
header h1
{
font-family: 'BallparkWeiner', serif;
font-size: 2.5em;
font-weight: normal;
}
#logo, header h1
{
display: inline-block;
margin-bottom: 0px;
}
header h2
{
font-family: Dayrom, serif;
font-size: 1.1em;
margin-top: 0px;
font-weight: normal;
}
h2
{
color: green;
font-family:algerian;
font-size:14;
font-style:normal;
font-weight:bold;
text-decoration:blink;
}
nav
{
display: inline-block;
width: 740px;
text-align:right;
}
nav ul
{
list-style-type:none;
}
nav li
{
display: inline-block;
margin-right:80px;
padding-right:"";
}
nav a
{
font-size: 1em;
color: green;
padding-bottom: 2px;
}
nav a:hover
{
color: red;
border-bottom: 2px solid yellow;
}
#banniere_image
{ margin-top: 15px;
height: 200px;
border-radius: 5px;
background: url('images/nathalie.jpg') no-repeat;
position: relative;
box-shadow: 0px 4px 4px #1c1a19;
margin-bottom: 25px;
}
#banniere_description
{
position: absolute;
bottom: 0;
border-radius: 0px 0px 5px 5px;
width: 99.5%;
height: 33px;
padding-top: 15px;
padding-left: 4px;
background-color: rgba(24,24,24,0.8);
color: white;
font-size: 0.8em;
}
.bouton_rouge
{
display: inline-bloc
height: 25px;
position: absolute;
right: 5px;
bottom: 5px;
background: url('ima
border: 1px solid #7
border-radius: 5px;
font-size: 1.5em;
text-align: center;
padding: 3px 8px 0px
color: yellow;
text-decoration: non
}
.bouton_rouge img
{
border: 0;
}
article, aside
{
display: inline-block;
vertical-align: top;
text-align: justify;
}
article
{
background-color: #345b64;
width: 625px;
margin-right: 15px;
border:1px solid green;
border-radius: 5px;
padding: 10px;
}
.ico_categorie
{
vertical-align: middle;
margin-right: 8px;
}
article p
{
font-size: 0.8em;
}
aside
{
position: right;
width: 230px;
background-color: #706b64;
box-shadow: 0px 2px 5px #1c1a19;
border-radius: 5px;
padding: 10px;
color: white;
font-size: 0.9em;
}
#fleche_bulle
{
position: absolute;
top: 100px;
left: -12px;
}
#photo_jc
{
text-align: center;
}
#photo_jc img
{
border: 1px solid #181818;
}
aside img
{
margin-right: 5px
}
.footer
{
width: 600px;
border:4px solid green;
background: url('images/ico_top.png') no-repeat top center;
padding-top: 2px;
padding-left:50;
marging-top:5px;
border-radius:5px;
}
footer p, footer ul
{
font-size: 0.8em;
}
footer h1
{
font-size: 1.1em;
}
#tweet, #mes_photos, #mes_amis
{
display: inline-block;
vertical-align: top;
}
#tweet
{
width: 28%;
}
#mes_photos
{
width: 35%;
}
#mes_amis
{
width: 31%;
}
#mes_photos img
{
border: 1px solid #181818;
margin-right: 2px;
}
#mes_amis ul
{
display: inline-block;
vertical-align: top;
margin-top: 0;
width: 48%;
list-style-image: url('images/ico_liensexterne.png');
padding-left: 2px;
}
#mes_amis a
{
text-decoration: none;
color: #760001;
}
</style>
<title>Bienvenu Dans mon Site</title>
</head>
<body>
<div id="bloc_page">
<header>
<div id="titre_principal">
<P>logo de l'école
<img src="images/ime.png" alt="Photo_IME" />
</P>
<h2>Intech Center Sarl</h2>
</div>
<nav>
<ul>
<li><a href="accueil.html">accueil</a></li>
<li><a href="blog.html">blog</a></li>
<li><a href="#">cv</a></li>
<li><a href="#">contact</a></li>
</ul>
</nav>
</header>
<div id="banniere_image">
<div id="banniere_description">
Notre préoccupation est de vous satisfaire ...!
<a href="#" class="bouton_rouge">Voir l'article <img src="images/ime.png" alt="Photo_IME" /></a>
</div>
</div
<section>
<article>
<h1><img src="images/ime.png" alt="Photo_IME" /> </h1>
<p>Contrat commerce électronique
Contrat entre Intech Center Sarl, entreprise commerciale qui exerce dans la vente des ordinateurs complets et accessoires informatiques, situé à Ndog-bong sis au Carrefour Bifiga. Et le client, M. Nathan</p>
</article>
<aside>
<h1>Nos règles</h1>
<p id="photo_jc"> <img src="images/ime.png" alt="Photo_IME" /></p>
<p>Ainsi, nous engageons à respecter les conditions suivantes :
de faire un dépannage en cas de panne du moniteur et l'unité centrale ;
de faire une maintenance d'entretien de l'unité centrale (en soufflant à l'intérieur) au 6èime mois ;
de faire une maintenance des logiciels (mise à jour des applications).
Toutefois, nous déclinons notre responsabilité dans les situations accidentelles qui suivront pour détruire la machine, telles que :
foudre : car, nous l'avons prévenu de mettre une fiche terre protéger ses équipements ;
surtension : car, nous l'avons averti de mettre un régulateur de tension contre les haute tensions qui viennent du secteur du courant électrique ;
incident matériel quel que soit qui viendra abimer la machine.
Moi soussigné M. Nathan, j'accepte entièrement tout ce qui écrit sur ce contrat à condition suspensive qui prend fin le 15 Février 2013.</p>
</aside>
</section>
<div class="footer">
<div id="facebook">
<h4>Notre facebook:intechcenter</h4>
</div>
<div id="mes_photos">
<h3>Nos images</h3>
<p><img src="images/photo1.jpg" alt="Photographie" /><img src="images/photo2.jpg" alt="Photographie" /><img src="images/photo3.jpg" alt="Photographie" /><img
src="images/photo4.jpg" alt="Photographie" /></p></div>
<div id="mes_amis">
<h3>Nos clients</h3>
<ul>
<li><a href="#">Pupi le lapin</a></li>
<li><a href="#">Mr Baobab</a></li>
<li><a href="#">Kaiwaii</a></li>
<li><a href="#">Perceval.eu</a></li>
</ul>
<ul>
<li><a href="#">Belette</a></li>
<li><a href="#">Le concombre masqué</a></li>
<li><a href="#">Ptit prince</a></li>
<li><a href="#">Mr Fan</a></li>
</ul>
</div>
<p>Bonjour.Souhaitez-vous visiter le <a href="https://openclassrooms.com/fr/" target="_blank" title="Réservé aux débutants">Site
du Zéro</a> ?</p>
</div>
</div>
</div>
</body>
</html>
<!DOCTYPE>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style>
body
{
background-color: #cccccc;
background:" url('image/shoot.png')";
font-family: 'Trebuchet MS', Arial, sans-serif;
color:"";
}
@media all and (max-width: 1024px)
{
#bloc_page
{
width: auto;
margin: auto;
}
}
section h1, footer h1, nav a
{
font-family: Dayrom, serif;
font-weight: normal;
text-transform: uppercase;
}
header
{
background: url('images/ime.png') repeat-x bottom;
}
#titre_principal
{
display: inline-block;
}
header h1
{
font-family: 'BallparkWeiner', serif;
font-size: 2.5em;
font-weight: normal;
}
#logo, header h1
{
display: inline-block;
margin-bottom: 0px;
}
header h2
{
font-family: Dayrom, serif;
font-size: 1.1em;
margin-top: 0px;
font-weight: normal;
}
h2
{
color: green;
font-family:algerian;
font-size:14;
font-style:normal;
font-weight:bold;
text-decoration:blink;
}
nav
{
display: inline-block;
width: 740px;
text-align:right;
}
nav ul
{
list-style-type:none;
}
nav li
{
display: inline-block;
margin-right:80px;
padding-right:"";
}
nav a
{
font-size: 1em;
color: green;
padding-bottom: 2px;
}
nav a:hover
{
color: red;
border-bottom: 2px solid yellow;
}
#banniere_image
{ margin-top: 15px;
height: 200px;
border-radius: 5px;
background: url('images/nathalie.jpg') no-repeat;
position: relative;
box-shadow: 0px 4px 4px #1c1a19;
margin-bottom: 25px;
}
#banniere_description
{
position: absolute;
bottom: 0;
border-radius: 0px 0px 5px 5px;
width: 99.5%;
height: 33px;
padding-top: 15px;
padding-left: 4px;
background-color: rgba(24,24,24,0.8);
color: white;
font-size: 0.8em;
}
.bouton_rouge
{
display: inline-bloc
height: 25px;
position: absolute;
right: 5px;
bottom: 5px;
background: url('ima
border: 1px solid #7
border-radius: 5px;
font-size: 1.5em;
text-align: center;
padding: 3px 8px 0px
color: yellow;
text-decoration: non
}
.bouton_rouge img
{
border: 0;
}
article, aside
{
display: inline-block;
vertical-align: top;
text-align: justify;
}
article
{
background-color: #345b64;
width: 625px;
margin-right: 15px;
border:1px solid green;
border-radius: 5px;
padding: 10px;
}
.ico_categorie
{
vertical-align: middle;
margin-right: 8px;
}
article p
{
font-size: 0.8em;
}
aside
{
position: right;
width: 230px;
background-color: #706b64;
box-shadow: 0px 2px 5px #1c1a19;
border-radius: 5px;
padding: 10px;
color: white;
font-size: 0.9em;
}
#fleche_bulle
{
position: absolute;
top: 100px;
left: -12px;
}
#photo_jc
{
text-align: center;
}
#photo_jc img
{
border: 1px solid #181818;
}
aside img
{
margin-right: 5px
}
.footer
{
width: 600px;
border:4px solid green;
background: url('images/ico_top.png') no-repeat top center;
padding-top: 2px;
padding-left:50;
marging-top:5px;
border-radius:5px;
}
footer p, footer ul
{
font-size: 0.8em;
}
footer h1
{
font-size: 1.1em;
}
#tweet, #mes_photos, #mes_amis
{
display: inline-block;
vertical-align: top;
}
#tweet
{
width: 28%;
}
#mes_photos
{
width: 35%;
}
#mes_amis
{
width: 31%;
}
#mes_photos img
{
border: 1px solid #181818;
margin-right: 2px;
}
#mes_amis ul
{
display: inline-block;
vertical-align: top;
margin-top: 0;
width: 48%;
list-style-image: url('images/ico_liensexterne.png');
padding-left: 2px;
}
#mes_amis a
{
text-decoration: none;
color: #760001;
}
</style>
<title>Bienvenu Dans mon Site</title>
</head>
<body>
<div id="bloc_page">
<header>
<div id="titre_principal">
<P>logo de l'école
<img src="images/ime.png" alt="Photo_IME" />
</P>
<h2>Intech Center Sarl</h2>
</div>
<nav>
<ul>
<li><a href="accueil.html">accueil</a></li>
<li><a href="blog.html">blog</a></li>
<li><a href="#">cv</a></li>
<li><a href="#">contact</a></li>
</ul>
</nav>
</header>
<div id="banniere_image">
<div id="banniere_description">
Notre préoccupation est de vous satisfaire ...!
<a href="#" class="bouton_rouge">Voir l'article <img src="images/ime.png" alt="Photo_IME" /></a>
</div>
</div
<section>
<article>
<h1><img src="images/ime.png" alt="Photo_IME" /> </h1>
<p>Contrat commerce électronique
Contrat entre Intech Center Sarl, entreprise commerciale qui exerce dans la vente des ordinateurs complets et accessoires informatiques, situé à Ndog-bong sis au Carrefour Bifiga. Et le client, M. Nathan</p>
</article>
<aside>
<h1>Nos règles</h1>
<p id="photo_jc"> <img src="images/ime.png" alt="Photo_IME" /></p>
<p>Ainsi, nous engageons à respecter les conditions suivantes :
de faire un dépannage en cas de panne du moniteur et l'unité centrale ;
de faire une maintenance d'entretien de l'unité centrale (en soufflant à l'intérieur) au 6èime mois ;
de faire une maintenance des logiciels (mise à jour des applications).
Toutefois, nous déclinons notre responsabilité dans les situations accidentelles qui suivront pour détruire la machine, telles que :
foudre : car, nous l'avons prévenu de mettre une fiche terre protéger ses équipements ;
surtension : car, nous l'avons averti de mettre un régulateur de tension contre les haute tensions qui viennent du secteur du courant électrique ;
incident matériel quel que soit qui viendra abimer la machine.
Moi soussigné M. Nathan, j'accepte entièrement tout ce qui écrit sur ce contrat à condition suspensive qui prend fin le 15 Février 2013.</p>
</aside>
</section>
<div class="footer">
<div id="facebook">
<h4>Notre facebook:intechcenter</h4>
</div>
<div id="mes_photos">
<h3>Nos images</h3>
<p><img src="images/photo1.jpg" alt="Photographie" /><img src="images/photo2.jpg" alt="Photographie" /><img src="images/photo3.jpg" alt="Photographie" /><img
src="images/photo4.jpg" alt="Photographie" /></p></div>
<div id="mes_amis">
<h3>Nos clients</h3>
<ul>
<li><a href="#">Pupi le lapin</a></li>
<li><a href="#">Mr Baobab</a></li>
<li><a href="#">Kaiwaii</a></li>
<li><a href="#">Perceval.eu</a></li>
</ul>
<ul>
<li><a href="#">Belette</a></li>
<li><a href="#">Le concombre masqué</a></li>
<li><a href="#">Ptit prince</a></li>
<li><a href="#">Mr Fan</a></li>
</ul>
</div>
<p>Bonjour.Souhaitez-vous visiter le <a href="https://openclassrooms.com/fr/" target="_blank" title="Réservé aux débutants">Site
du Zéro</a> ?</p>
</div>
</div>
</div>
</body>
</html>
