AccueilCalendrierFAQRechercherMembresGroupesS'enregistrerConnexion

Partagez | 
 

 (CSS) L' arrière-plan

Voir le sujet précédent Voir le sujet suivant Aller en bas 
AuteurMessage
Un flocon nommé • Stelyne

Grande fan de l'art ♔

avatar

Féminin Messages : 1561
Localisation : Europe 8D
MessageSujet: (CSS) L' arrière-plan   Dim 9 Oct - 11:48

L' arrière-plan
(suite à la demande d'Elly)
Voici un tutoriel pour en apprendre plus sur les fonds/arrières-plan. Ces derniers peuvent s'appliquer à des paragraphes, des textes, des pages web entières... Bref, tout ce qui est une balise HTML.

01. La propriété CSS pour appliquer une couleur de fond est background-color. Vous pouvez écrire sa valeur en utilisant le nom de la couleur en anglais, la notation hexadécimale, ou en utilisant la méthode RGB.
Code:
body
{
background-color: #FFFFFF;
}
Ici, le fond de toute la page web (body) sera blanc (#FFFFFF).

02. La propriété CSS pour appliquer une image de fond est background-image. Il faut lui mettre url('url_du_fond') comme valeur.
Code:
i
{
background-image: url('http://obsession27.free.fr/divers/fonds/fl2.gif');
}
Ici, le fond de tous les textes/mots en italiques (i) auront cette image de fond.

03. La propriété pour gérer la répétition de l'image de fond est background-repeat. Elle peut seulement être utilisée sur des balises de type block. Voici les valeurs qu'elle peut prendre ;
repeat : le fond sera répété (par défaut)
no-repeat : le fond ne sera pas répété
repeat-x : le fond sera répété horizontalement.
repeat-y : le fond sera répété verticalement.
Code:
body
{
background-image: url('http://obsession27.free.fr/divers/fonds/fl2.gif');
background-repeat: repeat-y;
}
Ici, le fond de toute la page web (body) aura cette image de fond répétée verticalement.

04. La propriété pour fixer une image de fond est background-attachment. Elle peut seulement être utilisée sur des balises de type block. Voici les valeurs qu'elle peut prendre ;
scroll : le fond défile (avec le texte) ; (par défaut)
fixed : le fond est fixe et le texte passe par dessus
Code:
body
{
background-image: url('http://obsession27.free.fr/divers/fonds/fl2.gif');
background-repeat: repeat-y;
background-attachment: fixed;
}
Ici, le fond de toute la page web (body) aura cette image de fond fixe.

background-attachment: fixed;

05. La propriété concernant la position de l'image de fond est background-position (il faudrait que votre fond soit fixe pour que celle-ci soit efficace). Il y a deux manières pour indiquer la position ;
• On utilise deux valeurs en pixels (le premier pour le nombre de pixels entre la partie gauche de la page et le fond | le second pour le nombre de pixels entre le haut de la page et le fond).
Exemple : background-position: 10px 20px; indique que votre fond sera décalé de 10 pixels sur la droite et de 20 pixels vers le bas.
• On utilise une ou deux valeurs en anglais (top, bottom, right, left soit haut, bas, droite, gauche).
Exemple : background-position: top right; indique que votre fond sera placé en haut à droite.

05.
Et comment mettre un fond en Html ?

Hum il n'y a pas de balise qui donne un fond à ma connaissance, mais il y a un attribut (bgcolor) utilisable sur une balise. Vous pouvez aussi utiliser l'attribut style et donner le CSS.

Code:
<body bgcolor="#FFFFFF">
<body style="background-color: #FFFFFF;">
Deux manières de mettre le fond de la page complète (body) en blanc (#FFFFFF).

& Pour insérer une image de fond ce sera :
Code:
<body background="URL">
<body style="background-image: url('URL');">

Et voilà ! En espérant que cela vous serve \o/
Par Stelyne pour Yume Artists © 2011





Merci pour tous vos superbes cadeaux :3:
 


Dernière édition par • Stelyne le Sam 12 Nov - 16:41, édité 2 fois
Revenir en haut Aller en bas
Voir le profil de l'utilisateur http://yumeartists.forumactif.biz
Un flocon nommé Elly

J'met de l'animation ♬

avatar

Féminin Messages : 758
Localisation : Quelque part.
MessageSujet: Re: (CSS) L' arrière-plan   Lun 10 Oct - 18:32

Merci Stelyne. <3 Euh, et en HTML est-ce que je pourrais avoir l'équivalent, please ? éwè enfin, si ça existe. /meurt





Revenir en haut Aller en bas
Voir le profil de l'utilisateur http://unkochi.forumactif.fr/
Un flocon nommé • Stelyne

Grande fan de l'art ♔

avatar

Féminin Messages : 1561
Localisation : Europe 8D
MessageSujet: Re: (CSS) L' arrière-plan   Lun 10 Oct - 18:50

Hum il n'y a pas de balise qui donne un fond à ma connaissance, mais il y a un attribut (bgcolor) utilisable sur une balise. Enfin tu peux utiliser l'attribut style et donner le CSS.

Code:
<body bgcolor="#FFFFFF">
<body style="background-color: #FFFFFF;">
Deux manières de mettre le fond de la page complète (body) en blanc (#FFFFFF).

Pour insérer une image de fond ce sera :
Code:
<body background="URL">
<body style="background-image: url('URL');">





Merci pour tous vos superbes cadeaux :3:
 
Revenir en haut Aller en bas
Voir le profil de l'utilisateur http://yumeartists.forumactif.biz
Un flocon nommé Elly

J'met de l'animation ♬

avatar

Féminin Messages : 758
Localisation : Quelque part.
MessageSujet: Re: (CSS) L' arrière-plan   Mer 12 Oct - 4:55

Oh, c'est exactement ce que je souhaitais, merci ! <3





Revenir en haut Aller en bas
Voir le profil de l'utilisateur http://unkochi.forumactif.fr/
Un flocon nommé Contenu sponsorisé




MessageSujet: Re: (CSS) L' arrière-plan   

Revenir en haut Aller en bas
 

(CSS) L' arrière-plan

Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Yume Artists ★  ::  :: TUTORIELS :: Codage-
Créer un forum | © phpBB | Forum gratuit d'entraide | Contact | Signaler un abus | Forumactif.com