Accueil Images Boîte à outils Liens Contact
 

 

 

 

 

Bote outils

Quelques petites astuces

Vous trouverez dans cette section des informations pratiques destines vous aider dans la cration de votre page ou de vos graphiques. Les rponses courtes et simples sont indiques directement dans le tableau ci-dessous; celles qui doivent tre plus dtailles sont expliques sur des pages distinctes.

Pour... Il faut...

Diviser facilement une page en plusieurs sections diffrentes

Consulter les explications sur cette page.

Rcuprer des images sur un site

Placer le curseur sur l'image de votre choix, puis cliquer avec le bouton droit de la souris, ce qui fera apparatre un menu contextuel; dans ce menu, cliquer sur "Enregistrer l'image sous...", puis choisir le rpertoire de votre disque dur dans lequel devra tre enregistre l'image, et cliquer sur "Enregistrer".

Utiliser une image comme fonds d'cran dans une page web

utiliser le code suivant :

<body background="image.jpg">

o image.jpg est remplacer par le nom de l'image de votre choix.

Empcher le fond d'cran de se rpter et le maintenir fixe

Configurer le code de fond d'cran comme suit :

<body background="image.jpg" style="background-repeat: no-repeat; background-attachment: fixed">

background-repeat: no-repeat signifie que le fond ne se rpte pas

et

background-attachment: fixed signifie que le fond ne dfile pas en mme temps que le texte.

Ajouter de la musique de fond Ajouter le code suivant :

<EMBED SRC="fichier_son.mid" WIDTH="50" HEIGHT="80" AUTOSTART="true" LOOP="-1">

o WIDTH="50" et HEIGHT="80" correspondent aux dimension du panneau de contrle. Si vous ne souhaitez pas afficher le panneau de contrle, remplacez ces valeurs par ce code : HIDDEN="true" .

AUTOSTART="true" indique que la musique doit dmarrer automatiquement l'affichage de la page.

LOOP="-1" (il est possible d'indiquer aussi "infinite" au lieu de "-1") indique que la musique doit jouer sans interruption (revient au dbut automatiquement et joue de nouveau). Si vous souhaitez spcificer le nombre de fois, indiquer la valeur (5, par exemple).

Ajouter des bordures de couleur aux cellules des tableaux Configurer le code de cellule de la manire suivante :

<td style="border-top: 2 solid #CE8E45">

o

border-top: signifie que la bordure s'applique la partie suprieure de la cellule (voir l'exemple de la cellule de cette rubrique). Les autres possibilits sont border-right, border-bottom et border-left.

2 solid signifie que la bordure fait 2 pixels de large et qu'elle est pleine

#CE8E45 correspond au code hexadcimal de la couleur de la bordure.

Choisir la couleur du texte

<font color="#FF0000>Texte de couleur rouge</font>
<font color="#0000FF>Texte de couleur bleue</font>
<font color="#000000>Texte de couleur noire</font>

Pour connatre les codes correspondant chaque couleur, vous pouvez par exemple consulter cette petite pallette de ma composition.

Faire ouvrir les liens dans une nouvelle fentre

<a href="http://www.yahoo.fr" target="_blank">

Pour que les liens s'ouvrent toujours dans la mme fentre, il suffit de donner un nom quelconque la cible ("target") et de l'attribuer tous les liens. Exemple :

<a href="http://www.voila.fr" target="_cherche">
<a href="http://www.nomade.fr" target="_cherche">
<a href="http://www.toile.qc.ca" target="_cherche">

Le premier lien cliqu va "crer", c'est--dire ouvrir, une nouvelle fentre qui s'appelera "cherche"; tous les autres liens s'ouvriront ensuite dans cette fentre.

Enlever le soulignement des liens et changer la couleur lorsque la souris passe dessus.

Recopier ce code l'intrieur des balises <HEAD></HEAD> :

<style TYPE="text/css">
<
!--
A:link {font: 12pt Verdana,sans-serif; text-decoration: none; color: #66CCFF;}
A:visited {font: 12pt Verdana,sans-serif; text-decoration: none; color: #FFCC66;}
A:active {font: 12pt Verdana,sans-serif; text-decoration: none; color: #007171;}
A:hover {font: 12pt Verdana,sans-serif; text-decoration: none; color: #33FF66;}

-->
</style>

Il s'agit de fonctions de feuilles de styles (CSS - Cascading Style Sheet). Le soulignement est dsactiv grce au paramtre text-decoration: none,

Pour personnaliser l'aspect des liens :

Modifier la grosseur des caractres et le type de police (font: xxpt Verdana,sans-serif;)

Indiquer une couleur diffrente pour chacun des tats du lien (color: #XXXXXX;).

noter : dans Netscape, la fonction A:hover (changement de couleur au passage de la souris) ne fonctionne pas.

Ajouter du texte sur un bouton

Il existe un site qui permet d'effectuer cette opration en ligne gratuitement:

ImageMagick Studio.

Par contre, comme il est en anglais, voici quelques explications sommaires qui vous permettront de l'utiliser facilement.

Dans l'espace intitul Filename, cliquer sur le bouton Parcourir et aller slectionner sur votre disque dur le bouton sur lequel vous voulez ajouter du texte.

Cliquer ensuite sur le bouton View. Votre bouton apparatra au centre de l'cran, juste en-dessous d'une srie d'onglets permettant d'effectuer des retouches graphiques. Cliquer sur l'onglet Annotate.

Dans l'espace intitul Text, taper le texte ajouter sur le bouton.

Juste en dessous, l'espace Location and Gravity permet de positionner le texte sur le bouton. Par exemple, pour un texte centr au milieu (avec un bouton de Grenadine/Webdco, par exemple) entrer les valeurs +0+10 et "Center" dans le menu droulant juste droite (pour ajuster plus prciment, modifier les valeur jusqu' obtention du rsultat souhait).

Attention : avant de cliquer sur annotate, descendre plus bas dans la page pour choisir les options du texte (font, couleur, etc.). Cliquer ensuite sur annotate. Une nouvelle page s'affichera avec le bouton contenant le texte.

Lorsque vous tes satisfait du rsultat, cliquer sur le bouton output dans la srie d'onglets de la barre suprieure (deuxime en partant de gauche). Dans l'espace Format, choisir "gif". Si vous n'tes pas familier avec le graphisme, conserver les options par dfaut des autres paramtres.

Cliquer sur le bouton output. Une nouvelle page s'affichera avec le bouton cr aparaissant sur un fond gris. En cliquant dessus, il s'affichera sur une nouvelle page blanche.

Pour le rcuprer, procder comme habituellement quand vous rcuprez une image sur le net.

Voil; il suffit de rpter l'opration pour chaque nouveau bouton sur lequel vous souhaitez ajouter du texte.

Si tout ceci vous semble trop compliqu, vous pouvez galement utiliser la mthode explique dans le tutorial Ajouter du texte sur un bouton

  
 

 

Accueil Images Boîte à outils Liens Contact

  Hit-Parade 

© Grenadine.net - 1998-2011