aboutsummaryrefslogtreecommitdiff
path: root/files/fr/web/css/shape-box/index.html
diff options
context:
space:
mode:
authorFlorian Merz <me@fiji-flo.de>2021-02-11 12:36:08 +0100
committerFlorian Merz <me@fiji-flo.de>2021-02-11 12:36:08 +0100
commit39f2114f9797eb51994966c6bb8ff1814c9a4da8 (patch)
tree66dbd9c921f56e440f8816ed29ac23682a1ac4ef /files/fr/web/css/shape-box/index.html
parent8260a606c143e6b55a467edf017a56bdcd6cba7e (diff)
downloadtranslated-content-39f2114f9797eb51994966c6bb8ff1814c9a4da8.tar.gz
translated-content-39f2114f9797eb51994966c6bb8ff1814c9a4da8.tar.bz2
translated-content-39f2114f9797eb51994966c6bb8ff1814c9a4da8.zip
unslug fr: move
Diffstat (limited to 'files/fr/web/css/shape-box/index.html')
-rw-r--r--files/fr/web/css/shape-box/index.html169
1 files changed, 0 insertions, 169 deletions
diff --git a/files/fr/web/css/shape-box/index.html b/files/fr/web/css/shape-box/index.html
deleted file mode 100644
index de7ad2607a..0000000000
--- a/files/fr/web/css/shape-box/index.html
+++ /dev/null
@@ -1,169 +0,0 @@
----
-title: <shape-box>
-slug: Web/CSS/shape-box
-tags:
- - CSS
- - Reference
- - Type
-translation_of: Web/CSS/shape-outside
-translation_of_original: Web/CSS/shape-box
----
-<div>{{CSSRef}}</div>
-
-<p>Le type de donnée CSS <strong><code>&lt;shape-box&gt;</code></strong> permet de définir des formes relatives aux boîtes de l'élément (voir <a href="/fr/Apprendre/CSS/Les_bases/Le_modèle_de_boîte">le modèle de boîtes</a>), notamment pour la propriété {{cssxref("shape-outside")}}.</p>
-
-<h2 id="Valeurs">Valeurs</h2>
-
-<dl>
- <dt><code>margin-box</code></dt>
- <dd>La forme correspond à la forme dessinée par le contour extérieur de la boîte de marge. Les rayons des coins de la forme sont définis grâce aux propriétés {{cssxref("border-radius")}} et {{cssxref("margin")}}. Si le ratio <code>border-radius</code> / <code>margin</code> est supérieur ou égal à 1, le rayon du coin de la boîte sera <code>border-radius</code> + <code>margin</code>. Si le ratio <code>border-radius / margin</code> est inférieur à 1, le rayon du coin de la boîte sera <code>border-radius + (margin * (1 + (ratio-1)^3))</code>.</dd>
- <dt><code>border-box</code></dt>
- <dd>La forme correspond à la forme dessinée par le contour extérieur de la boîte de bordure. Elle suit donc les règles normales de mise en forme de la bordure (notamment pour les coins arrondis).</dd>
- <dt><code>padding-box</code></dt>
- <dd>La forme correspond à la forme dessinée par le contour extérieur de la boîte de remplissage (<em>padding</em>). Elle suit les règles normales de mise en forme de la bordure (notamment pour les coins arrondis).</dd>
- <dt><code>content-box</code></dt>
- <dd>La forme correspond à la forme dessinée par le contour extérieur de la boîte de contenu. Le rayon de chaque coin correspondra à la valeur maximale entre <code>0</code> et <code>border-radius</code> - <code>border-width</code> - <code>padding</code>.</dd>
-</dl>
-
-<h2 id="Exemples">Exemples</h2>
-
-<h3 id="CSS">CSS</h3>
-
-<pre class="brush: css">.main {
- width: 500px;
- height: 200px;
-}
-
-.left {
- -webkit-shape-outside: polygon(0 0, 100% 100%, 0 100%);
- float: left;
- width: 40%;
- height: 12ex;
- background-color: lightgray;
- -webkit-clip-path: polygon(0 0, 100% 100%, 0 100%);
-}
-
-.right {
- -webkit-shape-outside: polygon(100% 0, 100% 100%, 0 100%);
- float: right;
- width: 40%;
- height: 12ex;
- background-color: lightgray;
- -webkit-clip-path: polygon(100% 0, 100% 100%, 0 100%);
-}
-
-p {
- text-align: center;
-}</pre>
-
-<h3 id="HTML">HTML</h3>
-
-<pre class="brush: html">&lt;div class="main"&gt;
- &lt;div class="left"&gt;&lt;/div&gt;
- &lt;div class="right"&gt;&lt;/div&gt;
- &lt;p&gt;
- Sometimes a web page's text content appears to be
- funneling your attention towards a spot on the page
- to drive you to follow a particular link. Sometimes
- you don't notice.
- &lt;/p&gt;
-&lt;/div&gt;</pre>
-
-<h3 id="Résultat">Résultat</h3>
-
-<h3 id="EmbedLiveSample('Exemples'100100)">{{EmbedLiveSample('Exemples',"100%","100%")}}</h3>
-
-<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('CSS Shapes', '#typedef-shape-box', '&lt;shape-box&gt;')}}</td>
- <td>{{Spec2('CSS Shapes')}}</td>
- <td>Définition initiale.</td>
- </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
- <tr>
- <th>Fonctionnalité</th>
- <th>Chrome</th>
- <th>Firefox (Gecko)</th>
- <th>Internet Explorer</th>
- <th>Opera</th>
- <th>Safari</th>
- </tr>
- <tr>
- <td>Support simple</td>
- <td>{{compatVersionUnknown}}</td>
- <td>{{CompatNo}}</td>
- <td>{{CompatNo}}</td>
- <td>{{CompatNo}}</td>
- <td>{{compatVersionUnknown}}</td>
- </tr>
- <tr>
- <td>\xx</td>
- <td>{{compatVersionUnknown}}</td>
- <td>{{CompatNo}}</td>
- <td>{{CompatNo}}</td>
- <td>{{CompatNo}}</td>
- <td>{{compatVersionUnknown}}</td>
- </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
- <tr>
- <th>Fonctionnalité</th>
- <th>Android</th>
- <th>Chrome pour Android</th>
- <th>Firefox Mobile (Gecko)</th>
- <th>IE Mobile</th>
- <th>Opera Mobile</th>
- <th>Safari Mobile</th>
- </tr>
- <tr>
- <td>Support simple</td>
- <td>{{compatVersionUnknown}}</td>
- <td>{{compatVersionUnknown}}</td>
- <td>{{CompatNo}}</td>
- <td>{{CompatNo}}</td>
- <td>{{CompatNo}}</td>
- <td>{{compatVersionUnknown}}</td>
- </tr>
- <tr>
- <td>\xx</td>
- <td>{{compatVersionUnknown}}</td>
- <td>{{compatVersionUnknown}}</td>
- <td>{{CompatNo}}</td>
- <td>{{CompatNo}}</td>
- <td>{{CompatNo}}</td>
- <td>{{compatVersionUnknown}}</td>
- </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Voir_aussi">Voir aussi</h2>
-
-<ul>
- <li>{{cssxref("shape-outside")}}</li>
- <li><a href="/fr/Apprendre/CSS/Les_bases/Le_modèle_de_boîte">Le modèle de boîtes CSS</a></li>
-</ul>