Modifier la couleur de fond

**Raptor92** · 11/04/2018, 19h32

Bonsoir

A nouveau, je fais appel à vous pour un problème de couleur de fond cette fois ci
Le code joint fonctionne très bien (grâce à votre aide...) mais je n'arrive pas à modifier la couleur de fond, je sais qu'il ne faut pas modifier le fichier css que je vais chercher (en rouge dans le code) et quelque soit le code que j'ajoute, même en créant un fichier css que j'appel, cela ne fonctionne pas

Pourriez-vous me mettre sur la bonne piste
Bien à vous et merci
Voir ligne 12

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
<!doctype html>
<html lang="en">
 
  <head>
    <title>SIMAG Solutions</title>
 
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 
    <!-- Bootstrap CSS -->
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous">
 
 
 
  </head>
 
  <body class="bg-info">
    <nav class="navbar navbar-expand-lg navbar-light bg-light">
  <a class="navbar-brand" href=" ">SIMAG Solutions</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>
 
 
  <div class="collapse navbar-collapse" id="navbarSupportedContent">
    <ul id="menu-vertical" class="navbar-nav mr-auto">
      <li class="nav-item active">
        <a class="nav-link" href="header.php">Home</a>
      </li>
	  	  <li class="nav-item">
        <a class="nav-link" href="user.php">Users List</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="create.php">User Created</a>
      </li>
	        <li class="nav-item">
        <a class="nav-link" href="#">Contact</a>
      </li>
	        <li class="nav-item">
        <a class="nav-link" href="#">Documents</a>
      </li>
	        </li>
	        <li class="nav-item">
        <a class="nav-link" href="#">Supply Chain</a>
      </li>
	        </li>
	        <li class="nav-item">
        <a class="nav-link" href="#">Stocks</a>
      </li>
	        </li>
	        <li class="nav-item">
        <a class="nav-link" href="#">Reporting</a>
      </li>
 
 
 
    </ul>
  </div>
</nav>

**eleydet** · 11/04/2018, 19h54

Bonsoir,

Avez-vous essayé :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
<body class="bg-info" style="background:#38f;">

**Raptor92** · 11/04/2018, 20h21

Bonsoir

Cela ne fonctionne pas, mais j'ai lu que cela ne fonctionnait plus en HTML5, est ce exact ?
En attendant, j'ai réussi à modifier le fichier CSS et cela fonctionne, mais plus globalement, est-il possible de faire appel à un ficher CSS comme je l'ai fait, qui lui possède une couleur de fond définie, et faire appel à un autre fichier pour forcer le changement de cette même couleur

J'ai lu que l'on pouvait le faire en faisant appel à un 2eme fichier en le mettant dessous le principal comme ceci par exemple:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="css/style.css" />

Mais cela ne fonctionne pas
Je vous remercie par avance pour vos réponses, cela m'aidera dans mes étapes suivantes
Bien à vous

**eleydet** · 12/04/2018, 07h40

Bonjour,

j'ai lu que cela ne fonctionnait plus en HTML5, est ce exact ?

A ma connaissance, c'est compatible avec le HTML5.

Je ne savais pas que le CSS pouvait prendre le dessus sur un style placé au sein même de la balise. J'ai regardé le fichier bootstrap.min.css... c'est un très gros fichier! La meilleure solution, il me semble, est de créer votre propre feuille de style, quitte à s'inspirer de la présentation de Bootstrap.

**Raptor92** · 12/04/2018, 07h48

Bonjour

C'est en effet ce que j'ai fait, mais pas pratique car je fais appel à différents fichiers de ce type et d'après ce que je lis, cela doit être possible
Je souhaite une validation quant à la faisabilité ou une autre piste.

En tout cas, merci pour votre réponse
Bien à vous

**eleydet** · 12/04/2018, 08h25

Rebonjour,

Je crois que j'ai trouvé. Voulez-vous essayer :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

 <body class="bg-info" style="background:#77f!important;">

Enfin tout de même, ce fichier proposé par Bootstrap est très complexe et volumineux...

Invité · 12/04/2018, 08h28

Bonjour,

1-

Envoyé par Raptor92

...Pourriez-vous me mettre sur la bonne piste...

Merci de consulter le forum CSS et les Cours et tutoriels pour apprendre CSS

2-

J'ai lu que l'on pouvait le faire en faisant appel à un 2eme fichier en le mettant dessous

OUI, c'est la bonne méthode

3-

Mais cela ne fonctionne pas

Encore faudrait-il montrer ton CODE !

4- Règles d'application des styles CSS et gestion des conflits

**Raptor92** · 12/04/2018, 09h13

Bonjour

En effet, désolé, le voici

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
<!DOCTYPE html>
<html>
<head>
<style>
body {
        color: #FFFFFF;
}
</style>
</head>

Invité · 12/04/2018, 09h52

Houlà,
La programmation, ce n'est pas de la magie !

Si c'est ça le contenu de ton fichier style.css, il faut VRAIMENT que tu lises les COURS CSS !

(je t'ai mis un lien...)

**Raptor92** · 12/04/2018, 11h03

Bonjour

Je vais suivre votre conseil, pas de soucis
Merci pour cette réponse

Modifier la couleur de fond

CSS

Discussions similaires

Partager

Partager