crowd-badge - Amazon SageMaker

crowd-badge

Icône flottante dans le coin supérieur droit d'un autre élément auquel elle est attachée.

Consultez un exemple interactif d'un modèle HTML qui utilise cet élément HTML Crowd dans CodePen.

Voici un exemple de modèle d'enquête qui utilise l'élément <crowd-badge>. Copiez le code suivant et enregistrez-le dans un fichier avec l'extension .html. Ouvrez le fichier dans n'importe quel navigateur pour prévisualiser et interagir avec ce modèle.

<script src="https://assets.crowd.aws/crowd-html-elements.js"></script> <crowd-form> <crowd-image-classifier name="crowd-image-classifier" src="https://unsplash.com/photos/NLUkAA-nDdE" header="Choose the correct category for this image." categories="['Person', 'Umbrella', 'Chair', 'Dolphin']" > <full-instructions header="Classification Instructions"> <p>Read the task carefully and inspect the image.</p> <p>Choose the appropriate label that best suits the image.</p> </full-instructions> <short-instructions id="short-instructions"> <p>Read the task carefully and inspect the image.</p> <p>Choose the appropriate label that best suits the image.</p> <crowd-badge icon="star" for="short-instructions"/> </short-instructions> </crowd-image-classifier> </crowd-form>

Attributes

Les attributs suivants sont pris en charge par cet élément.

for

Chaîne qui spécifie l'ID de l'élément auquel le badge est attaché.

icon

Chaîne qui spécifie l'icône à afficher dans le badge. La chaîne doit être le nom d'une icône de l'ensemble open source iron-icons, qui est préchargé, ou l'URL d'une icône personnalisée.

Cet attribut remplace l'attribut label.

Voici un exemple de syntaxe que vous pouvez utiliser pour ajouter une icône de fer à un élément HTML <crowd-badge>. Remplacez icon-name par le nom de l'icône que vous souhaitez utiliser dans ce jeu d'icônes.

<crowd-badge icon="icon-name" for="short-instructions"/>

label

Texte à afficher dans le badge. Il est recommandé d'utiliser trois caractères maximum pour que le texte ne dépasse pas de la zone du badge. Il est possible d'affiche une icône à la place du texte en définissant l'attribut icon.

Hiérarchie des éléments

Les éléments parents et enfants de cet élément sont les suivants :

  • Éléments parents: crowd-form

  • Éléments enfants : aucun

Voir aussi

Pour plus d’informations, consultez les rubriques suivantes.