Sujet Précédent Sujet Suivant

Organiser facilement une page.

Fermé
flo39400 Messages postés 596 Date d'inscription mardi 8 avril 2008 Statut Membre Dernière intervention 9 septembre 2021 - Modifié par flo39400 le 22/11/2016 à 15:50
 sebastien - 25 nov. 2016 à 14:02
Bonjour,
J'aimerai pouvoir disposer mes éléments comme bon me semble mais cela n'est pas comme je voudrais que cela sois.

Voici un petit schéma:





Ce qui est afficher:






Comment faire niveau code HTML5 pour bien organiser tous cela et suivant la taille de l’écran du visiteur ?

Et la mise en place du code CSS3.

Merci d'avance.


A voir également:

2 réponses

Réponse 1 / 2
sebastien
25 nov. 2016 à 13:57
Tu peux utiliser l'attribut float
pour ton exemple de ce que tu veux
le premier tu touches pas et tu peux faire ainsi par exemple
CE NE SONT QUE DES EXEMPLES 
<div width="100%"><!-- Ceci donne à la div 100% de largeur-->
<p> ton texte </p> ou <a href="tes liens>et le nom ici</a>

Pour les trois div cote à cote tu peux faire ainsi 
<div widht="10%" style="float:left;margin-right:5%">
<div> ton contenu</div></div><!-- premiere div elle dégage un espace à droite avec une marge à droite de 5%-->
<div width="40%" style="float:left;margin:5%">
<div> ton contenu</div></div>
<!-- tu l'auras compris j'adapte la largeur en fontion de ce que je veux -->
<div width="20%" >
<div> ton contenu</div>

N'oublie pas d'utiliser la propriété clear:both si tu met un truc en dessous 
exemple <p style="clear:both"> Ce texte ne flottera plus</p>
1
sebastien
Modifié par sebastien le 25/11/2016 à 14:05
Deux trucs encore
tu peux copier les codes ils sont avec des balises commentaires
Second truc vérifie l'orthographe sinon cela ne fait pas sérieux
et en bonus 
<footer style="margin-botton:0px"><!-- Ce footer restera coller en bas de page pour le mettre dans le css tu dois apeller une page comme ceci-->
<link rel="stylesheet" type="text/css" href="le nom de la page.css">
<!-- toujours enregistrer dans un .CSS-->
<!-- Le style ce note comme ceci --->
footer{ margin-bottom:0px} <!-- si plusieurs valeurs ainsi-->
footer {margin-bottom:0px; background-color:#fefefe}

et pour le code du haut j'ai commis une erreur .....
Cette ligne 
<div width="40%" style="float:left;margin:5%">

doit devenir ceci 
 <div width="40%" style="float:left;margin-right:5%">
0
Réponse 2 / 2
jordane45 Messages postés 38241 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 17 septembre 2024 4 689
22 nov. 2016 à 16:46
Bonjour,

Le plus simple si tu veux faire du "responsive" (c.a.d compatible avec toutes les tailles d'écran...) c'est d'utiliser un framework CSS comme BootStrap par exemple.
https://getbootstrap.com/getting-started/
0
flo39400 Messages postés 596 Date d'inscription mardi 8 avril 2008 Statut Membre Dernière intervention 9 septembre 2021 21
22 nov. 2016 à 17:09
Bas je veux surtout comprendre la maitrise des objets sur une page HTML via le CCS.

Car rien que la page tous en anglais ça fait peur.....
0

Discussions similaires

[référencement] Ne pas être référencé
kij_82 -
Searaphina -

10 réponses
Dupliquer une page word
Profalex2 -
Profalex2 -

2 réponses
connection ok mais aucune page ne s'affiche
gandounet -
fabiennetitou -

10 réponses