---
title: border-bottom-color
slug: Web/CSS/border-bottom-color
tags:
  - CSS
  - Dokumentacje
translation_of: Web/CSS/border-bottom-color
---
<p>{{ CSSRef() }}</p>

<h2 id="Podsumowanie" name="Podsumowanie">Podsumowanie</h2>

<p><code>border-bottom-color</code> ustawia kolor dolnego obramowania elementu, poprzez wartość koloru lub słowo kluczowe <code>transparent</code>.</p>

<ul>
 <li>{{ Xref_cssinitial() }}: własność {{ Cssxref("color") }}</li>
 <li>Stosowana do: wszystkich elementów</li>
 <li>{{ Xref_cssinherited() }}: nie</li>
 <li>Procenty: niedostępne</li>
 <li>Media: {{ Xref_cssvisual() }}</li>
 <li>{{ Xref_csscomputed() }}: jeśli wzięta z własności 'color', wtedy wartość wyliczona własności 'color'; w innym przypadku jako określone</li>
</ul>

<h2 id="Sk.C5.82adnia" name="Sk.C5.82adnia">Składnia</h2>

<pre class="eval">border-bottom-color: <em>color</em> | transparent | inherit
</pre>

<h2 id="Warto.C5.9Bci" name="Warto.C5.9Bci">Wartości</h2>

<dl>
 <dt>color </dt>
 <dd>Kolor może być zdefiniowany jako szestnastkowa wartość RGB, zwykła wartość RGB lub poprzez użycie jednego z predefiniowanych słów określających kolory.</dd>
 <dt>transparent </dt>
 <dd>Element nie ma własnego koloru, zamiast tego pokazuje kolor elementu pod spodem.</dd>
</dl>

<h2 id="Powi.C4.85zane_w.C5.82asno.C5.9Bci" name="Powi.C4.85zane_w.C5.82asno.C5.9Bci">Powiązane własności</h2>

<ul>
 <li>{{ Cssxref("border-color") }}</li>
 <li>{{ Cssxref("border-left-color") }}</li>
 <li>{{ Cssxref("border-right-color") }}</li>
 <li>{{ Cssxref("border-top-color") }}</li>
</ul>

<h2 id="Przyk.C5.82ady" name="Przyk.C5.82ady">Przykłady</h2>

<p><a href="/samples/cssref/border.html">Zobacz przykład</a></p>

<pre>element {
	width: 300px;
        padding: 15px;
        border-bottom-size: 1px;
        border-bottom-style: solid;
        border-bottom-color: #000;
}

</pre>

<h3 id="Notatki" name="Notatki">Notatki</h3>

<ul>
 <li><a class="external" href="http://html-color-codes.com/">Color Chart by VisiBone</a></li>
</ul>

<h2 id="Specifications">Specifications</h2>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="col">Specification</th>
   <th scope="col">Status</th>
   <th scope="col">Comment</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>{{SpecName('CSS3 Backgrounds', '#border-bottom-color', 'border-bottom-color')}}</td>
   <td>{{Spec2('CSS3 Backgrounds')}}</td>
   <td>No significant changes, though the <code>transparent</code> keyword, now included in {{cssxref("&lt;color&gt;")}} which has been extended, has been formally removed.</td>
  </tr>
  <tr>
   <td>{{SpecName('CSS2.1', 'box.html#border-color-properties', 'border-bottom-color')}}</td>
   <td>{{Spec2('CSS2.1')}}</td>
   <td>Initial definition</td>
  </tr>
 </tbody>
</table>

<h2 id="Browser_Compatibility">Browser Compatibility</h2>

<p>{{CompatibilityTable}}</p>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Chrome</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari (WebKit)</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>1.0</td>
   <td>{{CompatGeckoDesktop("1.0")}}<sup>[1]</sup></td>
   <td>4</td>
   <td>3.5</td>
   <td>1.0 (85)</td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Android</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>IE Phone</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>1.0</td>
   <td>{{CompatGeckoMobile("1.0")}}<sup>[1]</sup></td>
   <td>6.5</td>
   <td>11</td>
   <td>1.0</td>
  </tr>
 </tbody>
</table>
</div>

<p>[1] Gecko-based browsers like Firefox also support the non-standard {{Cssxref("-moz-border-bottom-colors")}} CSS property that sets the bottom border to <strong>multiple</strong> colors.</p>

<h2 id="See_also">See also</h2>

<ul>
 <li>The border-related CSS shorthand properties {{Cssxref("border")}}, {{Cssxref("border-bottom")}}, and {{Cssxref("border-color")}}.</li>
 <li>The color-related CSS properties applying to the other borders: {{Cssxref("border-right-color")}}, {{Cssxref("border-top-color")}}, and {{Cssxref("border-left-color")}}.</li>
 <li>The other border-related CSS properties applying to the same border: {{cssxref("border-bottom-style")}} and {{cssxref("border-bottom-width")}}.</li>
</ul>