border-left

  • Revision slug: CSS/border-left
  • Revision title: border-left
  • Revision id: 20904
  • Created:
  • Creator: Mgjbot
  • Is current revision? No
  • Comment robot Adding: [[fr:CSS:border-left]] <<langbot>>

Revision Content

{{template.CSSRef()}}

Summary

The border-left is a shorthand property for setting the width, style and color of left border of a box. This property can be used to set the values for one or more of: {{template.Cssxref("border-left-width")}}, {{template.Cssxref("border-left-style")}}, {{template.Cssxref("border-left-color")}}. Omitted values are set to their initial values.

  • Initial value: see individual properties for details
  • Applies to: all elements
  • Inherited: no
  • Percentages: N/A
  • Media: visual
  • Computed value: see individual properties

Syntax

border-left: [border-width || border-style || border-color | inherit] ;

Values

border-width
See {{template.Cssxref("border-width")}}.
border-style 
See {{template.Cssxref("border-style")}}.
border-color 
See {{template.Cssxref("border-color")}}.

Examples

element { 
    border-left: 1px solid #000;
}

Notes

If the rule does not specify a border color, the border will have the color specified by the {{template.Cssxref("color")}} property.

Specifications

Browser compatibility

Browser Lowest Version
Internet Explorer 4
Firefox 1
Netscape 4
Opera 3.5

See also

{{wiki.template('CSS_Reference:Border')}}

{{wiki.template('CSS_Reference:Border-left')}}

{{ wiki.languages( { "fr": "fr/CSS/border-left", "pl": "pl/CSS/border-left" } ) }}

Revision Source

<p> 
{{template.CSSRef()}}
</p>
<h3 name="Summary"> Summary </h3>
<p>The <code>border-left</code> is a shorthand property for setting the width, style and color of left border of a box. This property can be used to set the values for one or more of: {{template.Cssxref("border-left-width")}}, {{template.Cssxref("border-left-style")}}, {{template.Cssxref("border-left-color")}}. Omitted values are set to their initial values.
</p>
<ul><li> Initial value: see individual properties for details
</li><li> Applies to: all elements
</li><li> Inherited: no
</li><li> Percentages: N/A
</li><li> Media: <a href="en/CSS/Media/Visual">visual</a>
</li><li> Computed value: see individual properties
</li></ul>
<h3 name="Syntax"> Syntax </h3>
<pre class="eval">border-left: [<i>border-width</i> || <i>border-style</i> || <i>border-color</i> | <i>inherit</i>] ;
</pre>
<h3 name="Values"> Values </h3>
<dl><dt> border-width</dt><dd> See {{template.Cssxref("border-width")}}.
</dd><dt> border-style </dt><dd> See {{template.Cssxref("border-style")}}.
</dd><dt> border-color </dt><dd> See {{template.Cssxref("border-color")}}.
</dd></dl>
<h3 name="Examples"> Examples </h3>
<pre>element { 
    border-left: 1px solid #000;
}
</pre>
<h3 name="Notes"> Notes </h3>
<p>If the rule does not specify a border color, the border will have the color specified by the {{template.Cssxref("color")}} property.
</p>
<h3 name="Specifications"> Specifications </h3>
<ul><li> <a class="external" href="http://www.w3.org/TR/CSS1#border-left">CSS 1</a>
</li><li> <a class="external" href="http://www.w3.org/TR/CSS21/box.html#propdef-border-left">CSS 2.1</a>
</li><li> <a class="external" href="http://www.w3.org/TR/css3-background/#the-border-shorthands">CSS 3</a>
</li></ul>
<h3 name="Browser_compatibility"> Browser compatibility </h3>
<table class="standard-table">
  <tbody><tr>
    <th>Browser</th>
    <th>Lowest Version</th>
  </tr>
  <tr>
    <td>Internet Explorer</td>
    <td>4</td>
  </tr>
  <tr>
    <td>Firefox</td>
    <td>1</td>
  </tr>
  <tr>
    <td>Netscape</td>
    <td>4</td>
  </tr>
  <tr>
    <td>Opera</td>
    <td>3.5</td>
  </tr>
</tbody></table>
<h3 name="See_also"> See also </h3>
<p>{{wiki.template('CSS_Reference:Border')}}
</p><p>{{wiki.template('CSS_Reference:Border-left')}}
</p>
<div class="noinclude">
</div>
{{ wiki.languages( { "fr": "fr/CSS/border-left", "pl": "pl/CSS/border-left" } ) }}
Revert to this revision