Menu

Bannière HTML/CSS (site web)

Messages postés
55
Date d'inscription
samedi 28 mai 2016
Dernière intervention
8 décembre 2018
- - Dernière réponse : Code_Louis_TV
Messages postés
4
Date d'inscription
mercredi 12 décembre 2018
Dernière intervention
12 décembre 2018
- 12 déc. 2018 à 11:54
Bonjour,


Je commence depuis peu le HTML et le CSS en parallèle de mes cours d'ICN au lycée, et je dois créer un site.

Ce que je veux faire (qui est plutôt esthétique), c'est intégrer une simple bannière dans l'en-tête de la page principale, qui sera en fait une image, avec du texte dessus : à la façon de (openclassrooms.com), j'aurai un menu, sous celui-ci ma bannière (environ du 1920x470 je dirais pour un écran fullHD) et en dessous le contenu de la page avec le pied de page.

J'ai beaucoup cherché sur Internet mais comme je n'ai pas obtenu de résultat satisfaisant, je poste ici.

Je veux qu'il n'y ait aucun bord à l'image afin qu'elle soit "collée" aux côtés de la page. J'ai réussi à coller l'image en mettant un margin: 0; pour le body, mais seulement ça décale aussi le texte, alors que je veux uniquement coller l'image, pas le reste (margin, border et padding ne fonctionnent pas quand je les applique pour img ou .banniere).

J'essaye de comprendre un peu comment fonctionnent les balises en HTML et comment fonctionne le CSS, mais j'ai un peu de mal à vrai dire... avec l'ensemble de choses que j'ai lu, j'ai mis une balise <div class="...">. J'ai ensuite mis l'image, que j'ai tenté de configurer dans le CSS.. voici les codes correspondants ci-dessous :

HTML :
		<header>		
			<h1>TPE: Intelligence Artificielle dans la Médecine</h1>
			<div class="banniere">
				<img src='file:///C:/Users/Utilisateur/Desktop/ICN-site%20tpe%20IA/fichiers/img4.png' alt=image4>
			</div>
		</header>

CSS :
body {
	font-family: Arial;
	background-color: #ededed;
	margin: 0;
	}
  
img {
	width: 1920px;
	height: 470px;
	margin: 0;
	border: 0;
	padding: 0;
	}

.banniere {
	width: 1920px;
	height: 470px;
	margin: 0;
	border: 0;
	padding: 0;
	}


Pour le CSS, j'avais essayé de mettre un .banniere et #banniere, mais je me suis rendu compte que l'écriture n'y change rien à l'image ! par contre avec un img, qui fait référence à la balise <img src= ...>, là je peux mettre du 500x500 en dimensions par exemple, et ça va fonctionner. Donc il y a beaucoup de choses que je ne comprends pas encore forcément, mais c'est normal puisque je débute :)

Merci d'avance pour l'aide que vous pouvez apporter (à moi et à ceux qui sont dans la même situation ..) !
Afficher la suite 

Votre réponse

2 réponses

0
Merci
WAAA la coincidence de ouf, je fais un tpe aussi sur la téléchirurgie et je suis en train de faire un site pour ça. La tu tombes bien je n'ai pas trop compris ce que tu veux faire réellement mais j'ai les bases en html et css je pourrais t'aider plus en détail, ajoute moi sur discord : maclevine#3478
Commenter la réponse de maclevine
Messages postés
4
Date d'inscription
mercredi 12 décembre 2018
Dernière intervention
12 décembre 2018
0
Merci
Salut,

As-tu essayé de positionner l'image en background?

Est-ce que tu as défini la largeur de ta page web ?

Code Louis
Commenter la réponse de Code_Louis_TV
Netflix 6.6.1 APK modded apk | Nokia Tone | Mark Ronson