crowd-card - Amazon SageMaker

crowd-card

Cadre surélevé pour afficher des informations.

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

Voici un exemple de modèle conçu pour les tâches d'analyse des sentiments qui utilisent l'élément <crowd-card> 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> <style> h3 { margin-top: 0; } crowd-card { width: 100%; } .card { margin: 10px; } .left { width: 70%; margin-right: 10px; display: inline-block; height: 200px; } .right { width: 20%; height: 200px; display: inline-block; } </style> <crowd-form> <short-instructions> Your short instructions here. </short-instructions> <full-instructions> Your full instructions here. </full-instructions> <div class="left"> <h3>What sentiment does this text convey?</h3> <crowd-card> <div class="card"> Nothing is great. </div> </crowd-card> </div> <div class="right"> <h3>Select an option</h3> <select name="sentiment1" style="font-size: large" required> <option value="">(Please select)</option> <option>Negative</option> <option>Neutral</option> <option>Positive</option> <option>Text is empty</option> </select> </div> <div class="left"> <h3>What sentiment does this text convey?</h3> <crowd-card> <div class="card"> Everything is great! </div> </crowd-card> </div> <div class="right"> <h3>Select an option</h3> <select name="sentiment2" style="font-size: large" required> <option value="">(Please select)</option> <option>Negative</option> <option>Neutral</option> <option>Positive</option> <option>Text is empty</option> </select> </div> </crowd-form>

Attributes

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

heading

Texte affiché en haut du cadre.

image

URL d'une image à afficher dans le cadre.

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.