Problème de code html/css
Matprox
-
declique69 -
declique69 -
Bonjour, j' ai un problème qui est que je souhaite mettre deux class dans une seule balise mais, dans mon code css, je ne sait pas comment faire.
Voilà mon code si vous voulez :
Pour info, c' est au "<li class="btn menu-acceuil">" que galère.
Voilà mon code si vous voulez :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Titre</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
<style type="text/css">
</style>
</head>
<body>
<?php
include'navbar.php';
?>
<h1>Mon site!</h1>
</body>
</html>
<link rel="stylesheet" type="text/css" href="css/navbar.css">
<nav class="menu-nav">
<ul>
<li class="btn menu-acceuil">
<a href="#">
Acceuil
</a>
</li>
<li class="btn">
<a href="news.html">
Actualités
</a>
</li>
<li class="btn">
<a href="contact.html">
Contact
</a>
</li>
</ul>
</nav>
Pour info, c' est au "<li class="btn menu-acceuil">" que galère.
h1.headline{
color: black;
font-size: 50px;
}
nav.menu-nav ul li.btn a{
color: black;
background-color: white;
text-decoration: none;
}
nav.menu-nav ul li.btn{
list-style-type: none;
display: inline-block;
}
nav.menu-nav ul li.btn:hover a{
color: grey;
background-color: white;
transition: 1.5s all;
}
li {
font-size: 20pt;
padding: 5px 20px;
}
5 réponses
-
Bonjour,
1 - Ta question concernant le css ... je la déplace dans le forum CSS.
2 - En quoi mettre deux class dans un élément html te pose problème ?
Tu n'expliques pas ton souci.. tu dis juste que ça galère...
Hors..; à moins d'être devin.. il va nous être difficile de comprendre ton souci.
Donc, merci d'expliquer EXACTEMENT le problème constaté
-
Donc tu veux cibler le li qui a les deux class
btn menu-acceuil
Dans ce cas,li.btn.menu-acceuil{ }
Bien entendu, après toute modification de CSS (ou de JS ) il faut vider le cache de ton navigateur pour être sûr que les modifications sont prises en compte.
-
Ce que je veux faire c est rendre indépendante chaques balises <li> pour pouvoir changer la taille , la police ... de chacunes.
-
-
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question -
Le plus simple sera peut-être d'utiliser un sélecteur par numéro d'élément. Cela évitera de devoir associer une classe à chaque balise <li>
On peut écrire
li:nth-child(1) {... styles...}
li:nth-child(2) {... styles...}
Etc.
Voir le sélection nth-child :
http://stylescss.free.fr/v2-selectors/child.php
