Bric à Brac informatique 

A propos des ID avec BlueGriffon (versions 1.7.2 et 1.8)

Rappels :

• Pour personnaliser un élément unique d'une page HTML, BlueGriffon donne la possibilité d'introduire  l'attribut id.  
• Un ID ne peut être utilisé qu’une seule fois dans la page

Créer un ID

La création d'un ID implique le choix d'un nom qui lui sera affecté. 

Il existe plusieurs méthodes pour affecter d'un nom un ID dans BlueGriffon

Méthode la plus simple :

• Placer le curseur dans l'élément qui sera affecté de cet ID
  
  
• Sélectionner l'élément donné dans la barre de structure
  
• Activer l'icône ID de la Barre d'outils  
  
  
• Cliquer dans l'encadré texte, (pas d'ID)
  
• Taper le nom que vous souhaitez donner à cet ID (sans espace, sans accent) et
  
  
• Appuyer sur la touche Entrée.
  

Le nom de l'ID est enregistré.

ATTENTION : l'ID a été créé. Il est affecté à l'élément que vous avez choisi. Son nom  s'affiche dans la barre de structure avec un #(appelé dièse en français ou hashtag pour les anglophones) devant son nom, associé à l’élément désigné. Mais et il n'a aucune propriété. Il n'existe pas pour la Feuille de Styles. Voir plus loin comment personnaliser cet ID

Méthode à l'aide du panneau Styles CSS :

ATTENTION : l'utilisation de cette méthode implique qu'il n'y ait pas eu de modifications effectuées au niveau des Préférences, onglet Styles. Manuel dans l'encadré Politique CSS doit rester coché. 

• Placer le curseur dans l'élément qui contiendra cet id
  
  
• Sélectionner l’élément dans la barre de structure
  
  
• Activer la commande : Panneau, Styles CSS pour afficher le panneau Styles CSS. Celui-ci contient 14 sections différentes pour la version 1.8 (il y en avait 13 dans la version précédente)
  
  



• Dans l'encadré Appliquer les styles à (1) garder le choix affiché par défaut indiquant uniquement cet élément via son ID (en haut du panneau) (2)
  
  
• A partir de maintenant, n'importe quel choix que vous effectuerez dans le panneau CSS provoquera l'affichage d'une boite de dialogue pour permettre d'attribuer un nom à l'ID.
  Exemple : choisir un style de police (3) ou/et choisir de mettre le texte en Gras (4)
  
  
• Saisir un nom au clavier (sans accent, sans espace).
  
  
• Cliquer sur le bouton OK

Le choix de propriétés effectué dans le Panneau CSS est automatiquement répercuté dans le document. Le nom de l'ID  associé à l’élément désigné s'affiche dans la barre de structure avec un # (dièse ou hashtag) devant son nom,

Contrairement à la méthode précédente, l'id est enregistré dans la feuille de style interne ou dans la feuille de style externe liée (si elle existe).

Attribuer un ID existant à un élément donné

Rappel : un ID ne peut être utilisé qu'une seule fois dans la page

Pour affecter un élément d'un ID existant (non utilisé), dans votre document :

• Placer le curseur dans l'élément
• Activer l'icône ID de la barre d'outils et



• Cliquer sur la tête de flèche à droite de l'encadré texte. Si votre document contient des IDs, la totalité des id enregistrés dans la feuille de style (interne ou externe) s'affiche en liste déroulante.
• Sélectionner le nom de l'ID
• Appuyer sur la touche Entrée : l'ID est affecté à l'élément désigné
  

Supprimer un ID lié à un élément

Pour supprimer un ID lié à un élément :

• Placer le curseur dans l'élément : le nom de l'ID s'affiche dans l'encadré texte de l'icône ID
• Effacer le nom de l'ID affiché
• Appuyer sur la touche Entrée

Note : L'ID n'est plus affecté à l'élément mais il n'est pas supprimé de la Feuille de Styles

Modifier l'attribution d'un ID lié à un élément

Sur une même page le même ID ne peut être utilisé plusieurs fois.

Il est possible de transférer un ID d'un élément à un autre.

Exemple : Si un ID est affecté à un élément A et que vous souhaitez qu'il le soit à l'élément B

• Placer le curseur dans l'élément B

  

• Sélectionner l'ID dans la liste déroulante de l'icône ID
• Appuyer sur la touche Entrée

Une boite de dialogue s'affiche pour donner le choix entre le fait de supprimer l'ID dans l'élément A ou d'annuler cette action. Effectuer le choix : Supprimer l'ID

Ajouter, supprimer et/ou modifier les propriétés d'un  ID 

Les propriétés peuvent être gérées dans BlueGriffon à partir du Panneau Styles CSS

Le panneau Styles CSS contient 14 sections différentes, effectuer vos choix.

Voir la fiche Panneau, Styles CSS

Dernière mise à jour : le 09/08/14