Besoin d'aide pour du HTML

Résolu/Fermé
etiennette57 Messages postés 370 Date d'inscription mardi 6 avril 2010 Statut Membre Dernière intervention 9 mai 2017 - 20 janv. 2014 à 16:13
AssassinTourist Messages postés 5710 Date d'inscription lundi 16 janvier 2012 Statut Contributeur Dernière intervention 29 février 2024 - 21 janv. 2014 à 18:18
Bonjour, je suis sur un petit projet pour mon école de commerce, un petit site internet et je suis en grosse difficultés sur quelques petites choses.
tout d'abord, je galère a adapter la taille d'une image dans une Frame...
je n'y arrive pas !
Quelqu'un pour m'aider ?
Merci
A voir également:

2 réponses

Bonsoir,

Tout d'abord les FRAME sont à éviter. Il s'agit d'un système complétement désuet qui pose d nombreux problèmes. La complexité qu'elle apporte est en outre souvent inutile, de nombreux outils comme javascript pallie avantageusement aux nécessités(aujourd'hui totalement inexistane de ce fait) d'un jeu de frames ou même d'une iframe.

Pour les dimensions de images, la mise e page et le positionnement il faut utiliser CSS.
CSS permet de modifier les paramètres des balises HTML par le biais des propriétés CSS qui sont une gamme étendu allant de l'affichage de jolis cadres/contours, de couleurs, d'iamges de fond de positionnement, de gestion des tailles des éléments et des balises de la page.

après c'est dur de dire quoi que ce soit sans voir le code ni savor ce que vous voulez.

Un exemple css pour modifier la taille d'une image:

<img src="image.jpg" style="width:220px;" />
donne à l'image la longueur 220px, la hauteur sera automatiquement adapté en fonctiojn pour conserver le rapport des dimensions.

Souvent les éléments de la page(surtout s'ils font partie du design) doivent être indiqués en valeur relative.
En effet une taille fixe fera que chaque utilisateur qui a un écran différent et taille et résolution d'écran(voire zoom) différente aura une taille et des dimensions différentes. Or lorsque l'on fait une page internet c'est pour qu'elle s'affiche de façon globalement identique pour tout le monde. Ces différentes de taille peuvent provoquer des positionnements aberrants et perde la mise en page que vous aurez concocté voire même peuvent créer des bugs d'affichage.

La solution est d'utiliser le % et le quadratin(em) dans les dimensions de vos pages.


Par exemple dans votre page:

<div style='width:100%;'>
<img src="image.jpg" style="width:33%" >
<!---------- INDIQUERA QUE L'IMAGE PRENDS 33% DE LA LARGEUR TOTALE DE SOJN ELEMENT CONTENEUR(que j'ai mis exprès à 100%-->
</div>

Quel que soit l'utilisateur et la taille de la fenêtre qu'il utilise pour voir sa page l'image fera partout 1/3 longueur.


Pour le quadratin c'est une unité typographique qui correspond à la hauteur d'une ligne de caractères en plomb.
Nous ne sommes pas en imprimerie mais cette unité permettras d'avoir des dimensions, positionnement, décalages en fonction de la taille du texte affiché par l'utilisateur.
Cela permets de garder la mise en page en fonction de la taille du texte.


<h1>Hamlet le prince des danois</h1>

<p>
<span style="padding-top:2em;" />
Il y a quelque chose de pourri au royaume du Danemark. Le roi est mort et ...

</p>

avec padding-top(marge supérieure de la balise ç laquelle le style est appliqué) de valeur 2em(2 lignes de textes de haut) j'ai mis un décalage de 2 lignes de la taille de celle du paragraphe.


la balise h1 concernant un titre le texte est dans une taille de police supérieur.
Si nous lui attribuons des dimensions en em celle ci seront différentes des dimensions em du texte courant(balise p)

<h1 style="margin-left:0.75em" />Hamlet le prince des danois </h1>
Va décaler le bloc de h1 de 0.75Xla hauteur de la ligne h1 à partir de la gauche vers la droite.
0
AssassinTourist Messages postés 5710 Date d'inscription lundi 16 janvier 2012 Statut Contributeur Dernière intervention 29 février 2024 1 310
21 janv. 2014 à 18:18
Bonjour,

Tu as fait le site tout seul ou t'étais-tu basé sur quelque chose d'existant ?
Les frames sont le mal personnifié, c'est hasbeen. Il faut plutôt utiliser des div et leur appliquer un style avec du css.

Je te renvoie au site de tutos pour débutants : OpenClassroom
0