CSS/Eigenschaften/äußere Gestaltung/Rahmen/border-width

Aus SELFHTML-Wiki

Wechseln zu: Navigation, Suche

Sie können mit der Eigenschaft border-width für ein Element die Rahmendicke bestimmen. Sinnvollerweise sollten Sie diese Angabe zumindest mit einer Angabe zum Rahmentyp kombinieren, gegebenenfalls aber auch mit einer Festlegung der Rahmenfarbe.

[Bearbeiten] alle Seiten eines Elements

  • IE 3
  • Opera 5.12
  • Firefox 1.0
  • Konqueror 3.1
  • Safari 1.0
  • Chrome 4
  • CSS 1.0
Beispiel So sieht's aus
<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
    <title>border-width</title>
    <style>
      p {
        width:   30em;
	padding: 0 1em;}
 
      .links {
        border-left-width: 5px;
        border-left-style: solid;
        border-color:      #FFCCCC;}
 
      .linksrechts {
        border-left-width:  1em;
        border-left-style:  solid;
        border-left-color:  red;
        border-right-width: 1.5em;
        border-right-style: solid;
        border-right-color: green;}
 
      .rundrum {
        background-color:    lightgray;
        border-width:        6px;
        border-style:        solid;
        border-color:        gray;
	border-right-color:  black;
	border-bottom-color: black;}
    </style>
  </head>
  <body>
    <p class="links">Dies kennen Sie wahrscheinlich ...</p>
    <p class="linksrechts">Dies ist ... Textabsatz mit einem Rahmen links und rechts.</p>
    <p class="rundrum">Bereits mit einfachen Mitteln lassen sich interessante Effekte erzielen.</p>
  </body>
</html>

Mit border-width: können Sie die Dicke des Rahmens um ein Element bestimmen. Erlaubt ist eine numerische Angabe (mit Ausnahme von Prozentwerten) für die Rahmendicke oder einer der folgenden Werte:

  • thin = dünn.
  • medium = mittelstark.
  • thick = dick.
Beachten Sie: Eine Angabe für die Rahmendicke wird nur interpretiert, wenn auch eine Angabe für den Rahmentyp erfolgt.

[Bearbeiten] einzelne Seiten eines Elements

Um für einzelne Seiten des Elements eine unterschiedliche Rahmendicke zu bestimmen, gelten bei Verwendung der Eigenschaft border-width folgende Regeln:

  • Eine Angabe: für alle 4 Rahmen gilt derselbe Wert
  • Zwei Angaben: 1. Wert für oben und unten, 2. Wert für links und rechts
  • Drei Angaben: 1. Wert für oben, 2. Wert für links und rechts, 3. Wert für unten
  • Vier Angaben: 1. Wert für oben, 2. Wert für rechts, 3. Wert für unten, 4. Wert für links
Beachten Sie: Die Werte werden nicht durch Kommata getrennt.

Außerdem können Sie auch entsprechende Werte für die Eigenschaften

  • border-top-width, definiert die Rahmendicke für oben,
  • border-right-width, die Rahmendicke für rechts,
  • border-bottom-width, die Rahmendicke für unten und
  • border-left-width, die Rahmendicke für links

setzen.

Von „http://wiki.selfhtml.org/wiki/CSS/Eigenschaften/%C3%A4u%C3%9Fere_Gestaltung/Rahmen/border-width“
Hilfe
Weitere Bereiche
Flattr