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;
}
A voir également:
- Problème de code html/css
- Code ascii - Guide
- Code de déverrouillage oublié - Guide
- Code puk bloqué - Guide
- Code activation windows 10 - Guide
- Editeur html - Télécharger - HTML
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é
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
Dans ce cas,
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.
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
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
j' ai fait:
.(classe) {
color: red;
}
J ai enregistré et actualisé ma page mais sa n' a rien changé