diff options
Diffstat (limited to 'files/fr/web/html/attributs_universels/itemscope/index.html')
| -rw-r--r-- | files/fr/web/html/attributs_universels/itemscope/index.html | 228 |
1 files changed, 0 insertions, 228 deletions
diff --git a/files/fr/web/html/attributs_universels/itemscope/index.html b/files/fr/web/html/attributs_universels/itemscope/index.html deleted file mode 100644 index 5e76969620..0000000000 --- a/files/fr/web/html/attributs_universels/itemscope/index.html +++ /dev/null @@ -1,228 +0,0 @@ ---- -title: itemscope -slug: Web/HTML/Attributs_universels/itemscope -tags: - - Attribut - - Attribut universel - - HTML - - Micro-données - - Microdata - - Reference -translation_of: Web/HTML/Global_attributes/itemscope ---- -<div>{{HTMLSidebar("Global_attributes")}}</div> - -<p>L'<a href="/fr/docs/Web/HTML/Attributs_universels">attribut universel</a> <strong><code>itemscope</code> </strong>fonctionne généralement avec l'attribut <code>itemtype</code> afin d' indiquer qu'un bloc HTML contient un objet donné. <code>itemscope</code> crée l'objet et définit la portée de l'<code>itemtype</code> associé. Il est possible d'associer un attribut <code>itemscope</code> à n'importe quel élément HTML.</p> - -<h3 id="Les_identifiants_rattachés_à_itemscope">Les identifiants rattachés à <code>itemscope</code></h3> - -<p>Un élément qui possède un attribut <code>itemscope</code> permet de définir un nouvel élément qui sera un groupe de paires de noms/valeurs. Les éléments qui ont un attribut <code>itemscope</code> et un attribut <code>itemtype</code> peuvent également définir un attribut <code>id</code> (à ne pas confondre avec <code>itemid)</code> pour identifier de façon unique l'élément sur le Web.</p> - -<h2 id="Syntaxe">Syntaxe</h2> - -<h3 id="Syntaxe_formelle">Syntaxe formelle</h3> - -<pre class="syntaxbox">itemscope</pre> - -<h2 id="Exemple">Exemple</h2> - -<p>Dans cet exemple, on a trois attributs <code>itemscopes</code>. Ces trois <code>itemscopes</code> définissent les portées respectives des <code>itemtypes</code> correspondants qui sont : Recipe, AggregateRating et NutritionInformation.</p> - -<h3 id="HTML">HTML</h3> - -<pre class="brush: html"><div itemscope itemtype="https://schema.org/Recipe"> -<h2 itemprop="name">Grandma's Holiday Apple Pie</h2> -<img itemprop="image" src="https://c1.staticflickr.com/1/30/42759561_8631e2f905_n.jpg" width="50" height="50"/> -<p>By <span itemprop="author" itemscope itemtype="https://schema.org/Person"> -<span itemprop="name">Carol Smith</p></span> -</span> -<p>Published: <time datetime="2009-11-05" itemprop="datePublished"> -November 5, 2009</p></time> -<span itemprop="description">This is my grandmother's apple pie recipe. I like to add a dash of nutmeg.<br></span> - <span itemprop="aggregateRating" itemscope itemtype="https://schema.org/AggregateRating"> - <span itemprop="ratingValue">4.0</span> stars based on <span itemprop="reviewCount">35</span> reviews<br></span> -Prep time: <time datetime="PT30M" itemprop="prepTime">30 min<br></time> - Cook time: <time datetime="PT1H" itemprop="cookTime">1 hour<br></time> - Total time: <time datetime="PT1H30M" itemprop="totalTime">1 hour 30 min<br></time> - Yield: <span itemprop="recipeYield">1 9" pie (8 servings)<br></span> - <span itemprop="nutrition" itemscope itemtype="https://schema.org/NutritionInformation"> - Serving size: <span itemprop="servingSize">1 medium slice<br></span> - Calories per serving: <span itemprop="calories">250 cal<br></span> - Fat per serving: <span itemprop="fatContent">12 g<br></span> -</span> -<p>Ingredients:<br> - <span itemprop="recipeIngredient">Thinly-sliced apples: 6 cups<br></span> - <span itemprop="recipeIngredient">White sugar: 3/4 cup<br></span> - ... </p> - -Directions: <br> - <div itemprop="recipeInstructions"> - 1. Cut and peel apples<br> - 2. Mix sugar and cinnamon. Use additional sugar for tart apples. <br> - ... - </div> -</div> </pre> - -<h3 id="Structure_des_données">Structure des données</h3> - -<table class="standard-table"> - <tbody> - <tr> - <td colspan="1" rowspan="14">itemscope</td> - <td>itemtype</td> - <td colspan="2" rowspan="1">Recipe</td> - </tr> - <tr> - <td>itemprop</td> - <td>name:</td> - <td>Grandma's Holiday Apple Pie</td> - </tr> - <tr> - <td>itemprop</td> - <td>image:</td> - <td> - <div class="jyrRxf-eEDwDf jcd3Mb">https://c1.staticflickr.com/1/30/42759561_8631e2f905_n.jpg</div> - </td> - </tr> - <tr> - <td>itemprop</td> - <td>datePublished:</td> - <td>2009-11-05</td> - </tr> - <tr> - <td>itemprop</td> - <td>description:</td> - <td>This is my grandmother's apple pie recipe. I like to add a dash of nutmeg.</td> - </tr> - <tr> - <td>itemprop</td> - <td>prepTime:</td> - <td>PT30M</td> - </tr> - <tr> - <td>itemprop</td> - <td>cookTime:</td> - <td>PT1H</td> - </tr> - <tr> - <td>itemprop</td> - <td>totalTime:</td> - <td>PT1H30M</td> - </tr> - <tr> - <td>itemprop</td> - <td>recipeYield:</td> - <td>1 9" pie (8 servings)</td> - </tr> - <tr> - <td>itemprop</td> - <td>recipeIngredient:</td> - <td>Thinly-sliced apples: 6 cups</td> - </tr> - <tr> - <td>itemprop</td> - <td>recipeIngredient:</td> - <td>White sugar: 3/4 cup</td> - </tr> - <tr> - <td>itemprop</td> - <td>recipeInstructions:</td> - <td> - <div class="jyrRxf-eEDwDf jcd3Mb">1. Cut and peel apples 2. Mix sugar and cinnamon. Use additional sugar for tart apples .</div> - </td> - </tr> - <tr> - <td>itemprop</td> - <td colspan="2" rowspan="1">author [Person]:</td> - </tr> - <tr> - <td>itemprop</td> - <td>name:</td> - <td>Carol Smith</td> - </tr> - <tr> - <td colspan="1" rowspan="3">itemscope</td> - <td>itemprop[itemtype]</td> - <td colspan="2" rowspan="1">aggregateRating [AggregateRating]:</td> - </tr> - <tr> - <td>itemprop</td> - <td>ratingValue:</td> - <td>4.0</td> - </tr> - <tr> - <td>itemprop</td> - <td>reviewCount:</td> - <td>35</td> - </tr> - <tr> - <td colspan="1" rowspan="4">itemscope</td> - <td>itemprop[itemtype]</td> - <td colspan="2" rowspan="1">nutrition [NutritionInformation]:</td> - </tr> - <tr> - <td>itemprop</td> - <td>servingSize:</td> - <td>1 medium slice</td> - </tr> - <tr> - <td>itemprop</td> - <td>calories:</td> - <td>250 cal</td> - </tr> - <tr> - <td>itemprop</td> - <td>fatContent:</td> - <td>12 g</td> - </tr> - </tbody> -</table> - -<div class="note"> -<p><strong>Note</strong> : Pour extraire des micro-données d'un document HTML, vous pouvez utiliser <a href="https://developers.google.com/structured-data/testing-tool/">l'outil d'extraction de Google pour les micro-données.</a> Vous pouvez par exemple utiliser le document HTML précédent.</p> -</div> - -<h2 id="Spécifications">Spécifications</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaires</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('HTML Microdata', "#dfn-itemscope", "itemscope")}}</td> - <td>{{Spec2('HTML Microdata')}}</td> - <td> </td> - </tr> - <tr> - <td>{{SpecName('HTML WHATWG', "microdata.html#attr-itemscope", "itemscope")}}</td> - <td>{{Spec2('HTML WHATWG')}}</td> - <td> </td> - </tr> - </tbody> -</table> - -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> - -<div class="hidden">Le tableau de compatibilité de cette page a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et à nous envoyer une <em>pull request</em>.</div> - -<p>{{Compat("html.global_attributes.itemscope")}}</p> - -<h2 id="Voir_aussi">Voir aussi</h2> - -<ul> - <li><a href="/fr/docs/Web/HTML/Attributs_universels">Les différents attributs universels</a></li> - <li>Les autres attributs universels relatifs aux microdonnées : - <ul> - <li>{{htmlattrxref("itemid")}}</li> - <li>{{htmlattrxref("itemprop")}}</li> - <li>{{htmlattrxref("itemref")}}</li> - <li>{{htmlattrxref("itemscope")}}</li> - <li>{{htmlattrxref("itemtype")}}</li> - </ul> - </li> -</ul> |