Pouvez-vous me dire si mon code est juste`?

Résolu
nekfroid -  
 nekfroid -
Bonjour,



Configuration: Windows / Chrome 70.0.3538.110



<!DOCTYPE [/html/htmlintro.php3 html]>
<html>
<head>
 

 <meta charset="utf-8">
 <title>mdrr test</title>
  
  <link rel="stylesheet" href="src/css/main.css">


<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.1/css/all.css" integrity="sha384-gfdkjb5BdAXd+lj+gudLWI+BXq4IuLW5IT+brZEZsLFm++aCMlF1V92rMkPaX4PP" crossorigin="anonymous">


</head>


 <body>

  <header role='header'>

   
   <nav class="menu" role='naviagtion'>
    <div class="inner">
     <div class="m-left">
      <h3 class="logo"> Prof Ouatt </h3>
     </div>
     <div class="m-right" role="hover">
      <a href='#' class="m-link"> <i class="fas fa-home" aria-hidden='true'></i> Accueil</a>
      <a href='#' class="m-link"> <i class="fas fa-book" aria-hidden='true'></i> Mes oeuvres</a>
      <a href='#' class="m-link"> <i class="fas fa-user-graduate" aria-hidden='true'></i> Mon parcours</a>
      <a href='#' class="m-link"> <i class="fas fa-envelope" aria-hidden='true'></i> Me contacter</a>
      </div>
    </div>
     
   </nav>
    
   </div>
  </header>
 
  <div class="block">
   <div class="banner">
    <img src="src/img/bg1.jpg" class="banner-image">  
    <div class="banner-content">
     
      <h1 class="banner-text"> Bienvenue sur mon site! </h1>
     
    

    </div>
   </div>
  </div>
 <i class="fas fa-book-reader"></i>  
 <p class="text-content"> "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."</p>
 </body>










</html>




Je n'arrive pas à setup le :hover...


Merci, nekfroid.
A voir également:

2 réponses

Réponse 1 / 2
nekfroid
 
voici mon css : 

@import url('https://fonts.googleapis.com/css?family=Indie+Flower');
@import url('https://fonts.googleapis.com/css?family=Staatliches');
@import url('https://fonts.googleapis.com/css?family=Roboto:400,700');
@import url('https://fonts.googleapis.com/css?family=Shadows+Into+Light');



html,body{
 margin: 0; padding: 0

    font-family: 'Poppins', sans-serif;
}




body {
 background-color: darkgrey;
}
header {
 background-color: rgba(0, 0, 0, 0);
    height: 66px;
    vertical-align: middle;
 font-family: 'Roboto', sans-serif;
 text-transform: uppercase;
  font-weight: 700;
  position: fixed;
  
 }
 .logo{
  .margin-left: 
  background-color : white;
  color: white;
 font-size: x-large;


 }
.m-left{
 float: left;
}
.m-right{
 float: right;
    line-height: 66px;
    font-family: 'Poppins', sans-serif;
}
.menu{
 width: 100%
 height: 66px
 background-color: darkgrey;
 line-height: 66px
}
.logo{
 margin: 0; padding: 0;
 letter-spacing: 1px;
}
.m-link{
 color: white;
    padding: 0;
    margin: 0 25px;
}
.m-link i{
 margin-right: 5px;
}
.m-link  {
 border-bottom: 2px ;
 padding-bottom: 3px;
 text-decoration: none;
 text-transform: 
}
.inner {
 padding: 0; margin: 0 10px;
}

.m-link .hover { 
 border-bottom: 2px solid white;
 }


@media only screen and (max-width: 960px){
 .m-right { 
  display: none;
 }
}
.banner-image {
 width: 100%


}
.banner-text{
 font-family: 'Poppins', sans-serif;
 text-align: center;
    margin-top: -500px;
    color: white;
    position: fixed;

}
.text-content{
 font-family: 'Poppins', sans-serif;
 width: 33%;
 background-color: darkgrey;
 margin: 4 4px;
 padding: 4 4px;
 color: white;
}
.icon{
     color: white;

}
0
Réponse 2 / 2
Utilisateur anonyme
 
Bonjour

En css, le point devant un sélecteur signifie que tu fais référence à une classe.
Par exemple, logo et m-link sont des classes, tu définis .logo et .m-link dans ton CSS et c'est ok.

Mais hover n'est pas une classe. Tu ne dois pas écrire .hover
Pour indiquer que la souris passe sur un m-link, il faut utiliser la syntaxe 
.m-link:hover
.
0
nekfroid
 
merci bcp! je viens de comprendre, c-est regle .
0

Discussions similaires

sertissage des cables rj45
lekludo -
brupala -

7 réponses