text-align-last

  • Raccourci de la révision : CSS/text-align-last
  • Titre de la révision : text-align-last
  • ID de la révision : 236737
  • Créé :
  • Créateur : FredB
  • Version actuelle ? Non
  • Commentaire création de la page text-align-last; page created, 300 words added

Contenu de la révision

{{ CSSRef() }}

Résumé

La propriété CSS text-align-last décrit comment la dernière ligne d'un bloc ou une ligne est alignée juste avant un saut de ligne forcé.

<style type="text/css"></style>
  • {{ Xref_cssinitial() }} : auto
  • S'applique à : éléments blocs
  • {{ Xref_cssinherited() }} : oui
  • Média : {{ Xref_cssvisual() }}
  • {{ Xref_csscomputed() }} :comme spécifiée

Syntaxe

 text-align-last:  auto | start | end | left | right | center | justify | {{ Cssxref("inherit") }}

Valeurs

auto
La ligne affectée est aligne selon la valeur de {{ cssxref("text-align") }}.
start
Identique à left si la direction du texte est de gauche à droite et à right si la direction du texte est de droite à gauche.
end
Identique à right si la direction du texte est de gauche à droite et à left si la direction du texte est de droite à gauche.
left
Le contenu en ligne est aligné avec le bord gauche de la boîte de la ligne.
right
Le contenu en ligne est aligné avec le bord droit de la boîte de la ligne.
center
Le contenu est centré dans la boîte de la ligne.
justify
Le texte est justifié. Le texte devrait aligner ses bords droit et gauche avec les bords droit et gauche du paragraphe.

Exemples

div {
  text-align: justify;
  -moz-text-align-last: center;
  text-align-last: center;
}

Spécifications

Spécification État Commentaire
CSS Text Module Level 3 {{ Spec2('CSS3 Text') }}  

Compatibilité des navigateurs

{{ CompatibilityTable() }}

Fonction Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Support de base {{ CompatNo() }}
{{ WebkitBug("76173") }}
{{ CompatGeckoDesktop("12.0") }}{{ property_prefix('-moz') }} 5.5 {{ CompatNo() }} {{ CompatNo() }}
{{ WebkitBug("76173") }}
Fonction Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Support de base {{ CompatNo() }}
{{ WebkitBug("76173") }}
{{ CompatUnknown() }} {{ CompatGeckoMobile("12.0") }}{{ property_prefix('-moz') }} 6.0 {{ CompatNo() }} {{ CompatNo() }}
{{ WebkitBug("76173") }}

Dans Internet Explorer, les valeursstart et end ne sont pas supportées (en).

Voir également

  • {{ cssxref("text-align") }}

{{ languages( { "en": "en/CSS/text-align-last" }) }}

Source de la révision

<p>{{ CSSRef() }}</p>
<h2 id="R.C3.A9sum.C3.A9">Résumé</h2>
<p>La propriété CSS <code>text-align-last</code> décrit comment la dernière ligne d'un bloc ou une ligne est alignée juste avant un saut de ligne forcé.</p>
<nobr>
<style type="text/css"><![CDATA[.cssprop {
  display:table;
  padding: 0.4em;
  border-left:0.15em solid;
  background-color:#eeeeff
}
.cssprop li {
 display:table-row;
 padding: 3px;
 margin:0;
}
.cssprop li dfn {
  display:table-cell;
  padding: 0 5px;
  border-bottom: none;
  cursor:inherit;
}


]]></style>
<ul class="cssprop"> <li><dfn>{{ Xref_cssinitial() }} :</dfn> <code>auto</code></li> <li><dfn>S'applique à :</dfn> éléments blocs</li> <li><dfn>{{ Xref_cssinherited() }} :</dfn> oui</li> <li><dfn>Média :</dfn> {{ Xref_cssvisual() }}</li> <li><dfn>{{ Xref_csscomputed() }} :</dfn>comme spécifiée</li>
</ul>
</nobr>
<h2 id="Syntaxe">Syntaxe</h2>
<pre class="eval"> text-align-last:  auto | start | end | left | right | center | justify | {{ Cssxref("inherit") }}</pre>
<h3 id="Valeurs">Valeurs</h3>
<dl> <dt>auto</dt> <dd>La ligne affectée est aligne selon la valeur de {{ cssxref("text-align") }}.</dd> <dt>start</dt> <dd>Identique à <code>left</code> si la direction du texte est de gauche à droite et à <code>right</code> si la direction du texte est de droite à gauche.</dd> <dt>end</dt> <dd>Identique à right si la direction du texte est de gauche à droite et à <code>left</code> si la direction du texte est de droite à gauche.</dd> <dt>left</dt> <dd>Le contenu en ligne est aligné avec le bord gauche de la boîte de la ligne.</dd> <dt>right</dt> <dd>Le contenu en ligne est aligné avec le bord droit de la boîte de la ligne.</dd> <dt>center</dt> <dd>Le contenu est centré dans la boîte de la ligne.</dd> <dt>justify</dt> <dd>Le texte est justifié. Le texte devrait aligner ses bords droit et gauche avec les bords droit et gauche du paragraphe.</dd>
</dl>
<h3 id="Exemples">Exemples</h3>
<pre>div {
  text-align: justify;
  -moz-text-align-last: center;
  text-align-last: center;
}
</pre>
<h2 id="Sp.C3.A9cifications">Spécifications</h2>
<table class="standard-table"> <thead> <tr style="background-color: rgb(255, 204, 255);"> <th scope="col">Spécification</th> <th scope="col">État</th> <th scope="col">Commentaire</th> </tr> </thead> <tbody> <tr> <td><a class="external" href="http://www.w3.org/TR/css3-text/#text-align-last">CSS Text Module Level 3</a></td> <td>{{ Spec2('CSS3 Text') }}</td> <td> </td> </tr> </tbody>
</table>
<h2 id="Compatibilit.C3.A9_des_navigateurs">Compatibilité des navigateurs</h2>
<p>{{ CompatibilityTable() }}</p>
<div id="compat-desktop"> <table class="compat-table"> <tbody> <tr> <th>Fonction</th> <th>Chrome</th> <th>Firefox (Gecko)</th> <th>Internet Explorer</th> <th>Opera</th> <th>Safari (WebKit)</th> </tr> <tr> <td>Support de base</td> <td>{{ CompatNo() }}<br> {{ WebkitBug("76173") }}</td> <td>{{ CompatGeckoDesktop("12.0") }}{{ property_prefix('-moz') }}</td> <td>5.5</td> <td>{{ CompatNo() }}</td> <td>{{ CompatNo() }}<br> {{ WebkitBug("76173") }}</td> </tr> </tbody> </table>
</div>
<div id="compat-mobile"> <table class="compat-table"> <tbody> <tr> <th>Fonction</th> <th>Android</th> <th>Chrome for Android</th> <th>Firefox Mobile (Gecko)</th> <th>IE Mobile</th> <th>Opera Mobile</th> <th>Safari Mobile</th> </tr> <tr> <td>Support de base</td> <td>{{ CompatNo() }}<br> {{ WebkitBug("76173") }}</td> <td>{{ CompatUnknown() }}</td> <td>{{ CompatGeckoMobile("12.0") }}{{ property_prefix('-moz') }}</td> <td>6.0</td> <td>{{ CompatNo() }}</td> <td>{{ CompatNo() }}<br> {{ WebkitBug("76173") }}</td> </tr> </tbody> </table>
</div>
<p>Dans Internet Explorer, les valeurs<code>start</code> et <code>end</code> <a class="external" href="http://msdn.microsoft.com/en-us/library/ie/ms531163%28v=vs.85%29.aspx" title="http://msdn.microsoft.com/en-us/library/ie/ms531163%28v=vs.85%29.aspx">ne sont pas supportées (en)</a><span class="external">.</span></p>
<h2 id="Voir_.C3.A9galement">Voir également</h2>
<ul> <li>{{ cssxref("text-align") }}</li>
</ul>
<p>{{ languages( { "en": "en/CSS/text-align-last" }) }}</p>
Revenir à cette révision