Vous n'êtes pas identifié.

Annonce

#1 Code CSS : Les images. du 31-10-2007 13:20:40

mic54800
Super Modérateur ^^
Lieu: Brainville (54)
Date d'inscription: 25-08-2007
Messages: 819
Site web

Code CSS : Les images.

Afin d'allèger le poid de votre page et d'en améliorer sa rapidité, il est conseillé  d'afficher vos photos, images dans une feuille de style.
À savoir !!

Feuille CSS

background-image:url(photo.jpg) : url de l'image
width : largeur
height : hauteur
margin-left : marge gauche
margin-right : marge droite
margin-top : marge supérieure
margin-bottom : marge inférieure



Exemple :
Appelons nos pages : page.html & style.css

Nous allons créer les caractéristiques de notre photo :

style.css :

.nom-de-la-photo {
background-image:url(url-de-la-photo);
width: 600px;
height: 450px;
margin-left:30px;
}

[/!\ Le nom de la photo ne doit pas comprendre d'espace !!]

Ensuite, créons le lien sur la page où nous voulons mettre notre photo :
Ici, page.html

page.html :

<div class="nom-de-la-photo"></div>

Sans oublier de mettre entre les balises <head> </head> de la page " page.html " le code suivant, qui permet de faire appel au " style " contenu dans votre feuille de style sinon dit " style.css "

page.html :

<link rel="stylesheet" type="text/css" href="style.css" />



/!\ J'attend vos codes pour completer cette courte liste. /!\ cool

Dernière modification par mic54800 (31-10-2007 18:30:06)

Hors ligne

 

31-10-2007 13:20:40

Mister $$$


#2 Re Code CSS : Les images. du 20-09-2009 18:46:59

Rorschach
c00lnaute discret
Lieu: Haute-Normandie
Date d'inscription: 20-09-2009
Messages: 49

Re: Code CSS : Les images.

Je tiens à corriger un peu cela, l'utilisation des css pour afficher des photos ou images n'est utile que si la photo en question ne fait pas partie du contenu mais de la présentation de la page.

pour être clair, si l'image en question est un fond, une puce, un élément qui ne sera pas référencé alors oui on utilise les css, si l'image ou la photo est une illustration pour un paragraphe de texte, la photo d'un produit, un logo ou une image de galerie alors il ne faut pas utiliser les css pour l'afficher mais la balise <img> en ajoutant l'attribut alt pour le cas ou la photo ou image n'est pas affiché

il faut savoir que les éléments placé dans la css ne sont pas toujours disponible suivant avec quoi le visiteur parcours votre site, un lecteur d'écran (utilisé par les mal ou non voyant), certain navigateur simpliste comme ceux que l'on trouve sur certain mobile ancien feront l'impasse sur certain élément de la css, l'image risque donc de passé à la trappe.

de plus l'image ne sera pas aussi bien référencé si elle se trouve dans la css, les moteur de recherche considère (à raison) que ce qu'il y a dans la css n'est pas du contenu mais de la mise en forme

donc attention à n'utiliser la css que pour la mise en forme et non pas pour le contenu :)


Hors ligne

 

Propulsé par PunBB
© Copyright 2007
Forum créer un site

Partenaires de « créer un site internet »