DetailPage-MSS-KB

Base de connaissances

Numéro d'article: 928715 - Dernière mise à jour: mercredi 6 décembre 2006 - Version: 1.0

 

Sommaire

INTRODUCTION

Cet article explique comment utiliser les feuilles de style en cascade (CSS) pour créer des liens hypertexte personnalisés dans Microsoft Expression Web. Il contient des exemples qui montrent comment utiliser les fonctions CSS pour créer des liens hypertexte personnalisés.

Plus d'informations

Exemple 1: créer des liens hypertexte dans lequel la mise en forme souligné apparaît dans une autre couleur

Cet exemple montre comment mettre en forme le texte des liens hypertexte à la même couleur que le texte du document. Uniquement la mise en souligné forme des liens hypertexte s'affiche dans une couleur différente. Pour créer ces liens hypertexte personnalisé, procédez comme suit :
  1. Démarrez Expression Web et puis créer une nouvelle page vierge.
  2. Dans le menu Affichage , cliquez sur la page , puis cliquez sur code au bas de la page.
  3. Dans le <head> </head>zone de la page, insérez le code suivant :
    <style> 
    body { color: black; background-color: white; font-family: arial } 
    a { color: black; text-decoration: none; border-bottom-style: solid; border-bottom-width: 1px } 
    a:link { border-bottom-color: blue } a:visited { border-bottom-color: purple } 
    a:hover { border-bottom-color: green } a:active { border-bottom-color: red } 
    </style> 
  4. Dans le <body> </body>zone de la page, insérez le code suivant :
    <p>Please see <a href="http://www.microsoft.com">http://www.microsoft.com</a> for more.</p> 
    <p>Please see <a href="http://www.msn.com">http://www.msn.com</a> for more.</p> 
  5. Dans le menu Fichier , cliquez sur Enregistrer .
  6. Dans la boîte de dialogue Enregistrer sous , spécifiez un emplacement auquel vous souhaitez enregistrer le fichier.
  7. Dans la zone Nom de fichier , tapez Example1 et puis cliquez sur Enregistrer .
  8. Dans le menu Fichier , pointez sur Afficher dans le navigateur , puis cliquez sur le navigateur Web que vous souhaitez utiliser pour obtenir un aperçu de la page.

Exemple 2: créer des liens hypertexte qui utiliser boutons sensitifs

Cet exemple montre comment créer des liens hypertexte qui utiliser les boutons sensitifs qui ont un arrière-plan uni. Pour créer ces liens hypertexte personnalisé, procédez comme suit :
  1. Démarrez Expression Web et puis créer une nouvelle page vierge.
  2. Dans le menu Affichage , cliquez sur la page , puis cliquez sur code au bas de la page.
  3. Dans le <head> </head>zone de la page, insérez le code suivant :
    <style> 
    body { color: black; background-color: white; font-family: arial } 
    a { text-decoration: none; padding: 3px } 
    a:link { color: white; background-color: blue } 
    a:visited { color: white; background-color: purple } 
    a:hover { color: white; background-color: green } 
    a:active { color: white; background-color: red } 
    </style> 
  4. Dans le <body> </body>zone de la page, insérez le code suivant :
    <p>Please see <a href="http://www.microsoft.com">http://www.microsoft.com</a> for more.</p> 
    <p>Please see <a href="http://www.msn.com">http://www.msn.com</a> for more.</p> 
  5. Dans le menu Fichier , cliquez sur Enregistrer .
  6. Dans la boîte de dialogue Enregistrer sous , spécifiez un emplacement auquel vous souhaitez enregistrer le fichier.
  7. Dans la zone Nom de fichier , tapez Example2 et puis cliquez sur Enregistrer .
  8. Dans le menu Fichier , pointez sur Afficher dans le navigateur , puis cliquez sur le navigateur Web que vous souhaitez utiliser pour obtenir un aperçu de la page.

Exemple 3: créer des liens hypertexte qui utiliser boutons sensitifs plan

Cet exemple montre comment créer des liens hypertexte qui utiliser boutons sensitifs plan. Lorsque vous placez sur ces liens hypertexte, une zone de couleur apparaît autour le texte du lien hypertexte. Cela crée un effet de contour. Pour créer ces liens hypertexte personnalisé, procédez comme suit :
  1. Démarrez Expression Web et puis créer une nouvelle page vierge.
  2. Dans le menu Affichage , cliquez sur la page , puis cliquez sur code au bas de la page.
  3. Dans le <head> </head>zone de la page, insérez le code suivant :
    <style> 
    body { color: black; background-color: white; font-family: arial } 
    a { color: black; text-decoration: none; border-style: solid; border-width: 2px; padding: 2px } 
    a:link { border-color: blue } a:visited { border-color: purple } 
    a:hover { border-color: green } a:active { border-color: red } 
    </style> 
  4. Dans le <body> </body>zone de la page, insérez le code suivant :
    <p>Please see <a href="http://www.microsoft.com">http://www.microsoft.com</a> for more.</p> 
    <p>Please see <a href="http://www.msn.com">http://www.msn.com</a> for more.</p> 
  5. Dans le menu Fichier , cliquez sur Enregistrer .
  6. Dans la boîte de dialogue Enregistrer sous , spécifiez un emplacement auquel vous souhaitez enregistrer le fichier.
  7. Dans la zone Nom de fichier , tapez Example3 et puis cliquez sur Enregistrer .
  8. Dans le menu Fichier , pointez sur Afficher dans le navigateur , puis cliquez sur le navigateur Web que vous souhaitez utiliser pour obtenir un aperçu de la page.

Exemple 4: créer des liens hypertexte qui utilise un texte différent mise en forme

Cet exemple met en forme des liens hypertexte vers utiliser du texte non souligné, italique, minuscules. Lorsque vous placez sur ces liens hypertexte, le texte devient en majuscules. Pour créer ces liens hypertexte personnalisé, procédez comme suit :
  1. Démarrez Expression Web et puis créer une nouvelle page vierge.
  2. Dans le menu Affichage , cliquez sur la page , puis cliquez sur code au bas de la page.
  3. Dans le <head> </head>zone de la page, insérez le code suivant :
    <style> 
    body { color: black; background-color: white; font-family: arial } 
    a { text-decoration: none; font-style: italic; text-transform: lowercase } 
    a:link { color: blue; font-weight: bold } a:visited { color: purple } 
    a:hover { color: green; text-transform: uppercase } 
    a:active { color: red } 
    </style> 
  4. Dans le <body> </body>zone de la page, insérez le code suivant :
    <p>Please see <a href="http://www.microsoft.com">http://WWW.microsoft.COM</a> for more.</p> 
    <p>Please see <a href="http://www.msn.com">http://WWW.msn.COM</a> for more.</p> 
  5. Dans le menu Fichier , cliquez sur Enregistrer .
  6. Dans la boîte de dialogue Enregistrer sous , spécifiez un emplacement auquel vous souhaitez enregistrer le fichier.
  7. Dans la zone Nom de fichier , tapez Example4 et puis cliquez sur Enregistrer .
  8. Dans le menu Fichier , pointez sur Afficher dans le navigateur , puis cliquez sur le navigateur Web que vous souhaitez utiliser pour obtenir un aperçu de la page.

Références

Pour plus d'informations, cliquez sur les numéros ci-dessous pour afficher les articles correspondants dans la Base de connaissances Microsoft :
825450  (http://support.microsoft.com/kb/825450/ ) Comment faire pour créer des liens hypertexte personnalisés à l'utilisation de feuilles de style en cascade dans FrontPage 2003
196488  (http://support.microsoft.com/kb/196488/ ) Que sont en cascade des feuilles de style ?
222949  (http://support.microsoft.com/kb/222949/ ) Comment créer des effets de survol pour les boutons de formulaire il faut utiliser DHTML et CSS dans FrontPage

Les informations contenues dans cet article s'appliquent au(x) produit(s) suivant(s):
  • Microsoft Expression Web
Mots-clés : 
kbmt kbexpertiseinter kbhowto KB928715 KbMtfr
Traduction automatiqueTraduction automatique
IMPORTANT : Cet article est issu du système de traduction automatique mis au point par Microsoft (http://support.microsoft.com/gp/mtdetails). Un certain nombre d’articles obtenus par traduction automatique sont en effet mis à votre disposition en complément des articles traduits en langue française par des traducteurs professionnels. Cela vous permet d’avoir accès, dans votre propre langue, à l’ensemble des articles de la base de connaissances rédigés originellement en langue anglaise. Les articles traduits automatiquement ne sont pas toujours parfaits et peuvent comporter des erreurs de vocabulaire, de syntaxe ou de grammaire (probablement semblables aux erreurs que ferait une personne étrangère s’exprimant dans votre langue !). Néanmoins, mis à part ces imperfections, ces articles devraient suffire à vous orienter et à vous aider à résoudre votre problème. Microsoft s’efforce aussi continuellement de faire évoluer son système de traduction automatique.
La version anglaise de cet article est la suivante: 928715  (http://support.microsoft.com/kb/928715/en-us/ )
L'INFORMATION CONTENUE DANS CE DOCUMENT EST FOURNIE PAR MICROSOFT SANS GARANTIE D'AUCUNE SORTE, EXPLICITE OU IMPLICITE. L'UTILISATEUR ASSUME LE RISQUE DE L'UTILISATION DU CONTENU DE CE DOCUMENT. CE DOCUMENT NE PEUT ETRE REVENDU OU CEDE EN ECHANGE D'UN QUELCONQUE PROFIT.
Partager
Options de support supplémentaire
Forums du support Microsoft Community
Nous contacter directement
Trouver un partenaire Microsoft Certified Partner
Microsoft Store