18041 sujets

Questions générales et questions de débutants

[Résolu] Tous les textes en gras

bonjour à tous,

pourquoi j'ai du texte qui se met en gras sur une page et pas les autres?

alors que les pages son faites de la même manières.

merci pour votre réponse.
désoler,

<!DOCTYPE html>
<html lang="fr">
<head>
<!--meta-->
<meta name="viewport" content="width=device-width", initial-scale=1, maximun-scale=1/>
<meta charset="UTF-8">
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="author" content="">

<!--css-->
<link rel="stylesheet" media="screen" href="css/style.css">
<link rel="stylesheet" href="css/reset.css">

<link href='https://fonts.googleapis.com/css?family=Great+Vibes' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Noto+Serif' rel='stylesheet' type='text/css'>

<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

<!--js-->
<script src="../js/classie.js"></script>
<script>
function init() {
window.addEventListener('scroll', function(e){
var distanceY = window.pageYOffset || document.documentElement.scrollTop,
shrinkOn = 300,
header = document.querySelector("header");
if (distanceY > shrinkOn) {
classie.add(header,"smaller");
} else {
if (classie.has(header,"smaller")) {
classie.remove(header,"smaller");
}
}
});
}
window.onload = init();
</script>
<?php

require('inc_array.php');


?>
</head>

<body>
<div id="wrapper">

<header>

<img class="logo" src="img/nature-web.png" width="300" height="120" alt="logo" />

<nav>

<a href="#accueil"><img src="img/accueil.png" alt="accueil" onmouseout="javascript:this.src='img/accueil.png'" onmouseover="javascript:this.src='img/accueil2.png'" /> </a>
<a href="tendance.php"><img src="img/tendance.png" alt="accueil" onmouseout="javascript:this.src='img/tendance.png'" onmouseover="javascript:this.src='img/tendance2.png'" /></a>
<a href="#tarifs"><img src="img/tarif.png" alt="accueil" onmouseout="javascript:this.src='img/tarif.png'" onmouseover="javascript:this.src='img/tarif2.png'" /></a>
<a href="form.php"><img src="img/contact.png" alt="accueil" onmouseout="javascript:this.src='img/contact.png'" onmouseover="javascript:this.src='img/contact2.png'" /></a>


</nav>

</header>

<div id="content">

<div id="main">
<!------------------------------------------------section1------------------------------------------------------------------>
<section id="accueil">
<article class="block1">

<h3><?= $information['0']['title']; ?></h3>

<p><?= $information['0']['text']; ?></p>

</article>
<article class="block2">

<h3><?= $information['1']['title']; ?></h3>

<p><?= $information['1']['text']; ?></p>

</article>
<article class="block3">

<h3><?= $information['2']['title']; ?></h3>

<p><?= $information['2']['text']; ?></p>

</article>
</section>
<!------------------------------------------------section2------------------------------------------------------------------>

<section class="color">

<article>

<h1><?= $information['3']['title']; ?></h1>

<p class="center"><?= $information['3']['text']; ?><br /><?= $information['4']['text']; ?></p>

</article>
</section>

<!------------------------------------------------section3------------------------------------------------------------------>

<section>

<article class="aside1">

<h3><?= $information['5']['title']; ?></h3>

<p><?= $information['5']['text']; ?></p>

</article>
<article class="aside2">

<h3><?= $information['8']['title']; ?></h3>
<p><?= $information['8']['text']; ?></p>

</article>


</section>
<!------------------------------------------------section4------------------------------------------------------------------>
<section class="color">


<article class="block1_1">


<h1><?= $tendances['0']['title']; ?></h1>

<p id="fleche" class="lien"><a href="tendance.php #responsive"><?= $tendances['1']['title']; ?></a></p>




<p id="fleche" class="lien"><a href="tendance.php #menu"><?= $tendances['2']['title']; ?></a></p>


<p id="fleche" class="lien"><a href="tendance.php #scroll"><?= $tendances['3']['title']; ?></a></p>


<p id="fleche" class="lien" ><a href="tendance.php #mosaique"><?= $tendances['4']['title']; ?></a></p>

<p id="fleche" class="lien" ><a href="tendance.php #image"><?= $tendances['5']['title']; ?></a></p>



<p id="fleche" class="lien"><a href="tendance.php #flat"><?= $tendances['6']['title']; ?></a></p>



<p id="fleche" class="lien"><a href="tendance.php #video"><?= $tendances['7']['title']; ?></a></p>



<p id="fleche" class="lien" ><a href="tendance.php #typo"><?= $tendances['8']['title']; ?></a></p>


</article>

</section>
<!------------------------------------------------section5------------------------------------------------------------------>
<div id="tarif"></div>
<section id="tarifs">

<article class="block1_2">

<h3><?= $tarif['0']['title']; ?></h3>

<p><?= $tarif['0']['text']; ?></p>

</article>
<article class="block2_2">

<h3><?= $tarif['1']['title']; ?></h3>

<p><?= $tarif['1']['text']; ?></p>

</article>
<article class="block3_2">

<h3><?= $tarif['2']['title']; ?></h3>

<p><?= $tarif['2']['text']; ?></p>

</article>

<article class="block4_2">

<h3><?= $tarif['3']['title']; ?></h3>

<p><?= $tarif['3']['text']; ?></p>

</article>
</section>
<!------------------------------------------------section6------------------------------------------------------------------>
<section class="color">

<article>

<h1><?= $tarif['4']['title']; ?></h1>

<p><?= $tarif['4']['text']; ?><br /><?= $tarif['5']['text']; ?></p>

</article>

</section>



</div>
</div>

<footer>
<h3 class="p_foot">copyright &copy nature web</h3>

<p class="coordonne"><?= $information['6']['text']; ?></p>

<p class="number"><?= $information['7']['text']; ?></p>

</footer>
</div>

</body>
</html>


body{

	margin:0;
	padding:0;
	font-size:14px;
	font-family: 'Noto Serif', serif;
	
}
/************************************template*******************/

#wrapper{
  width: 100%;
  margin: 0 auto; 
   background:url(../img/nature2.jpeg) no-repeat fixed;
  background-size:cover;
	position:absolute;
   }
 #content{
  padding-top:150px;
  }
  #main{
	margin: 0 auto;
  
  }
 h1, h2, h3{
 
 color:#213717;
 text-shadow: 1px 1px 1px #fff;
  font-size:28px;


 
 } 
 a{color:#213717;text-decoration:none;}
 
 a:hover{color:#fff;}
 
  img{
	float:left;
	padding:20px;
	margin-top:10px;
 
 }

 p{
 
	color:#213717;
	text-align:center;
	font-size:14px;
 
 
 }
 /***********************************header**************************/
 header{
	  width: 100%;
		height: 150px;
	  overflow: hidden;
	  position: fixed;
	  top: 0;
	  left: 0;
	  z-index: 999;
	  background:url(../img/header.png) no-repeat;
	  background-size:cover;
	  -webkit-transition: height 0.3s;
	  -moz-transition: height 0.3s;
	  -ms-transition: height 0.3s;
	  -o-transition: height 0.3s;
	  transition: height 0.3s; 
	-webkit-border-bottom-right-radius: 30px;
	-webkit-border-bottom-left-radius: 30px;
	-moz-border-radius-bottomright: 30px;
	-moz-border-radius-bottomleft: 30px;
	border-bottom-right-radius: 30px;
	border-bottom-left-radius: 30px;
 }
 header img.logo{

	margin-left:2%;
	margin-top:15px;
 
 }
 header nav {
    display: inline-block;
    float: right; 
	margin-right:40px;
		}
 header nav a img{
      line-height: 150px;
      margin-top:75px;
	  	  margin-right:-40px;
		border:none;
      color: #9fdbfc;
      font-weight: 700;
      font-size: 18px;
      -webkit-transition: all 0.3s;
      -moz-transition: all 0.3s;
      -ms-transition: all 0.3s;
      -o-transition: all 0.3s;
      transition: all 0.3s; }
  /***************************************************section********************************************/
  section{
	width:90%;
  	min-height:300px;
	padding:150px 0;
	margin:60px 85px;
  
  }
  section.color{

	background:url(../img/section2.png) no-repeat;
	 background-size:cover;
	 -webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	border-radius: 30px;
  }
  section h1{ 
  text-align:center;
  margin-top:-50px;
  font-weight:700;
  font-size:32px;
  }
 

  article{
	width:700px;
  	float:left;  
	text-align:center;
	 line-height:2.2em;
	margin-left:470px;
	margin-top:-30px;
  
  }
  article h1{
  
	padding-bottom:50px;
  
  
  }
article.block1, article.block2, article.block3{
	width:260px;
	height:240px;
	background:url(../img/block2.png) no-repeat;
	margin-left:180px;
	padding:20px 0;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;

}


article.aside1, article.aside2{
	max-width:560px;
	height:260px;
	background:url(../img/blanc2.png) no-repeat;
	margin-left:160px;
	padding:20px 0;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;

}



article p.lien{
		
	width:300px;
	border:1px solid #213717;
	margin-top:10px;
	margin-left:195px;
	padding:5px;
	line-height:1.8em;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
article.block1_2, article.block2_2, article.block3_2,article.block4_2{
	width:280px;
	min-height:350px;
	margin-left:100px;
	padding:20px 0;
	background:url(../img/tarif1.png) no-repeat;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;

}
 article.decal_left{
 
	margin-left:38px;
 
 }

footer {
	  background:url(../img/section.png) no-repeat;
	  background-size:cover;
	  min-height:250px;
	  margin-top:60px;
	-webkit-border-top-left-radius: 30px;
	-webkit-border-top-right-radius: 30px;
	-moz-border-radius-topleft: 30px;
	-moz-border-radius-topright: 30px;
	border-top-left-radius: 30px;
	border-top-right-radius: 30px;
}
footer h3.p_foot{
	text-align:center;
  padding-top:20px;


}
p.coordonne{
	margin-right:83%;
	margin-top:-10px;

}
 p.number{

	margin-left:83%;
	margin-top:-55px;

}
et le "gras" il est à quel niveau ? ton html / php est illisible.
Modifié par JENCAL (08 Dec 2015 - 10:24)
désoler,


<!DOCTYPE html>
 <html lang="fr">
 <head>
 <!--meta-->
 <meta name="viewport" content="width=device-width", initial-scale=1, maximun-scale=1/>
 <meta charset="UTF-8">
 <meta name="description" content="">
 <meta name="keywords" content="">
 <meta name="author" content="">

 <!--css-->
 <link rel="stylesheet" media="screen" href="css/style.css">
 <link rel="stylesheet" href="css/reset.css">

 <link href='https://fonts.googleapis.com/css?family=Great+Vibes' rel='stylesheet' type='text/css'>
 <link href='https://fonts.googleapis.com/css?family=Noto+Serif' rel='stylesheet' type='text/css'>

 <!--[if lt IE 9]>
 <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
 <![endif]-->

 <!--js-->
 <script src="../js/classie.js"></script>
 <script>
 function init() {
 window.addEventListener('scroll', function(e){
 var distanceY = window.pageYOffset || document.documentElement.scrollTop,
 shrinkOn = 300,
 header = document.querySelector("header");
 if (distanceY > shrinkOn) {
 classie.add(header,"smaller");
 } else {
 if (classie.has(header,"smaller")) {
 classie.remove(header,"smaller");
 }
 }
 });
 }
 window.onload = init();
 </script>
 <?php 

 require('inc_array.php');


 ?>
 </head>

 <body>
 <div id="wrapper">

 <header>

 <img class="logo" src="img/nature-web.png" width="300" height="120" alt="logo" />

 <nav>

 <a href="#accueil"><img src="img/accueil.png" alt="accueil" onmouseout="javascript:this.src='img/accueil.png'" onmouseover="javascript:this.src='img/accueil2.png'" /> </a>
 <a href="tendance.php"><img src="img/tendance.png" alt="accueil" onmouseout="javascript:this.src='img/tendance.png'" onmouseover="javascript:this.src='img/tendance2.png'" /></a>
 <a href="#tarifs"><img src="img/tarif.png" alt="accueil" onmouseout="javascript:this.src='img/tarif.png'" onmouseover="javascript:this.src='img/tarif2.png'" /></a>
 <a href="form.php"><img src="img/contact.png" alt="accueil" onmouseout="javascript:this.src='img/contact.png'" onmouseover="javascript:this.src='img/contact2.png'" /></a>


 </nav>

 </header>

 <div id="content">

 <div id="main">
 <!------------------------------------------------section1------------------------------------------------------------------>
 <section id="accueil">
 <article class="block1">

 <h3><?= $information['0']['title']; ?></h3>

 <p><?= $information['0']['text']; ?></p>

 </article>
 <article class="block2">

 <h3><?= $information['1']['title']; ?></h3>

 <p><?= $information['1']['text']; ?></p>

 </article>
 <article class="block3">

 <h3><?= $information['2']['title']; ?></h3>

 <p><?= $information['2']['text']; ?></p>

 </article>
 </section> 
 <!------------------------------------------------section2------------------------------------------------------------------>

 <section class="color">

 <article>

 <h1><?= $information['3']['title']; ?></h1>

 <p class="center"><?= $information['3']['text']; ?><br /><?= $information['4']['text']; ?></p>

 </article>
 </section>

 <!------------------------------------------------section3------------------------------------------------------------------>

 <section>

 <article class="aside1">

 <h3><?= $information['5']['title']; ?></h3>

 <p><?= $information['5']['text']; ?></p>

 </article>
 <article class="aside2">

 <h3><?= $information['8']['title']; ?></h3>
 <p><?= $information['8']['text']; ?></p>

 </article>


 </section>
 <!------------------------------------------------section4------------------------------------------------------------------>
 <section class="color">


 <article class="block1_1">


 <h1><?= $tendances['0']['title']; ?></h1>

 <p id="fleche" class="lien"><a href="tendance.php #responsive"><?= $tendances['1']['title']; ?></a></p>




 <p id="fleche" class="lien"><a href="tendance.php #menu"><?= $tendances['2']['title']; ?></a></p>


 <p id="fleche" class="lien"><a href="tendance.php #scroll"><?= $tendances['3']['title']; ?></a></p>


 <p id="fleche" class="lien" ><a href="tendance.php #mosaique"><?= $tendances['4']['title']; ?></a></p>

 <p id="fleche" class="lien" ><a href="tendance.php #image"><?= $tendances['5']['title']; ?></a></p>



 <p id="fleche" class="lien"><a href="tendance.php #flat"><?= $tendances['6']['title']; ?></a></p>



 <p id="fleche" class="lien"><a href="tendance.php #video"><?= $tendances['7']['title']; ?></a></p>



 <p id="fleche" class="lien" ><a href="tendance.php #typo"><?= $tendances['8']['title']; ?></a></p>


 </article>

 </section>
 <!------------------------------------------------section5------------------------------------------------------------------>
 <div id="tarif"></div>
 <section id="tarifs">

 <article class="block1_2">

 <h3><?= $tarif['0']['title']; ?></h3>

 <p><?= $tarif['0']['text']; ?></p>

 </article>
 <article class="block2_2">

 <h3><?= $tarif['1']['title']; ?></h3>

 <p><?= $tarif['1']['text']; ?></p>

 </article>
 <article class="block3_2">

 <h3><?= $tarif['2']['title']; ?></h3>

 <p><?= $tarif['2']['text']; ?></p>

 </article>

 <article class="block4_2">

 <h3><?= $tarif['3']['title']; ?></h3>

 <p><?= $tarif['3']['text']; ?></p>

 </article>
 </section>
 <!------------------------------------------------section6------------------------------------------------------------------> 
 <section class="color">

 <article>

 <h1><?= $tarif['4']['title']; ?></h1>

 <p><?= $tarif['4']['text']; ?><br /><?= $tarif['5']['text']; ?></p>

 </article>

 </section>



 </div>
 </div>

 <footer>
 <h3 class="p_foot">copyright &copy nature web</h3>

 <p class="coordonne"><?= $information['6']['text']; ?></p>

 <p class="number"><?= $information['7']['text']; ?></p>

 </footer>
 </div>

 </body>
 </html>

tous le texte dans les articles de la première pages sait mis en gras hors qu'avant j avais pas.
Salut Boni,

Ta meta viewport est mal formée, elle devrait être ainsi:

 <meta name="viewport" content="width=device-width, initial-scale=1, maximun-scale=1"/>


Ensuite, dans le code HTML sans le CSS, impossible de savoir qui mets en gras.

Par contre, peut être qu'il y a un soucis sur l'ordre d'appel de tes fichiers de styles:

 <!--css-->
 <link rel="stylesheet" href="css/reset.css">

 <link href='https://fonts.googleapis.com/css?family=Great+Vibes' rel='stylesheet' type='text/css'>
 <link href='https://fonts.googleapis.com/css?family=Noto+Serif' rel='stylesheet' type='text/css'>
 
  <link rel="stylesheet" media="screen" href="css/style.css">


Je mettrais le reset css en premier, et ensuite définition des autres style (imports des fonts, puis ton style)

Peut être est-ce ceci que tu as changer qui t'a causé quelques petit problèmes ?
Bonsoir,

ton code php n'est d'aucune utilité, mais il serait intéressant de voir le code html généré.

Il peut s'agir d'une balise <hx>, <th>, <b>, < strong>, (sans code html difficile de dire en fait) qui ne serait pas refermé correctement.

Tu as un outil en ligne qui peut te servir à relever ce genre d'erreur : https://validator.w3.org/
Cdt,
Modifié par gc-nomade (10 Dec 2015 - 20:24)
Sujet clos
Aller à