Ressourcen: 120 HTML Farbnamen - Kombination von Farbe beige und Farbwert #ff8c00

Netscape führte seinerzeit die websicheren Farben ein. Neben diesen Farbwerten, die einem bestimmten Schema folgen, definierte man noch 120 Werte und ordnete ihnen Namen zu.

Hintergrundfarbe beige			Schriftfarbwert #ff8c00
Detail	:	Hintergrund beige	Detail	:	Schrift #ff8c00
Farbe	:	beige	Farbwert	:	#ff8c00
Farbwert	:	#f5f5dc	Farbe	:	darkorange
HTML	:	beige	HTML	:	#ff8c00
HTML (Wert)	:	#f5f5dc	HTML (Wert)	:	#ff8c00
CSS	:	beige	CSS	:	#ff8c00
CSS (Wert)	:	#f5f5dc	CSS (Wert)	:	#ff8c00
CSS (kürzest)	:	#f5f5dc	CSS (kürzest)	:	#ff8c00
CSS (RGB)	:	rgb(245,245,220)	CSS (RGB)	:	rgb(255,140,0)
CSS (%RGB)	:	rgb(96%,96%,86%)	CSS (%RGB)	:	rgb(100%,54%,0%)

Verlauf Hintergrundfarbe beige nach Schriftfarbwert #ff8c00
#f5f5dc	#f6e6bc	#f7d79d	#f9c87d	#fab95e	#fcaa3e	#fd9b1f	#ff8c00
#f5f5dc	#f6e6bc	#f7d79d	#f9c87d	#fab95e	#fcaa3e	#fd9b1f	#ff8c00

Kombination von beige und #ff8c00
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna. Cras id velit ante. Cras vestibulum tristique erat, ac interdum justo cursus in.				Die Ähnlichkeit von #ff8c00 und beige ergibt sich zu 89.96%. Die Lesbarkeit dieser Kombination von Farben bewerte ich mit 10.04%. Auf Hintergrund beige ist #ff8c00 ungeeignet, weil sich sowohl Helligkeit als auch die Farben zu ähnlich sind.

Hintergrundfarbe beige				Schriftfarbwert #ff8c00
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#f5f5dc	#f5f5dc	#f5f5dc	#f5f5dc	#ff8c00	#ff8c00	#ff8c00	#ff8c00
#f6f6e1	#f6f6e1	#d2d2bc	#d2d2bc	#ff9c24	#ff9c24	#da7800	#da7800
#f7f7e6	#f7f7e6	#afaf9d	#afaf9d	#ffac48	#ffac48	#b66400	#b66400
#f9f9eb	#f9f9eb	#8c8c7d	#8c8c7d	#ffbd6d	#ffbd6d	#915000	#915000
#fafaf0	#fafaf0	#69695e	#69695e	#ffcd91	#ffcd91	#6d3c00	#6d3c00
#fcfcf5	#fcfcf5	#46463e	#46463e	#ffdeb6	#ffdeb6	#482800	#482800
#fdfdfa	#fdfdfa	#23231f	#23231f	#ffeeda	#ffeeda	#241400	#241400
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe beige und Farbwert #ff8c00

Zebra-Effekt von Tag th

Man redet vom Zebra-Effekt, wenn zwei Farben abweselnd als Hintergrundfarbe genommen werden. Er unterstützt das Auge z.B. die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ung und .ger für <th> mit unterschiedlichen Hintergrundfarben Farbe beige und Farbwert #ff8c00.

<style type="text/css"><!--
  th.ung { 
    background-color: beige;
  }
  th.ger { 
    background-color: #ff8c00;
  }
//-->
</style>

Diese werden abwechselnd genutzt.

<table>
<tr><td class="ung">Ga~a</td><td class="ger">Gb~a</td><td class="ung">Gc~a</td></tr>
<tr><td class="ung">Ga~b</td><td class="ger">Gb~b</td><td class="ung">Gc~b</td></tr>
<tr><td class="ung">Ga~c</td><td class="ger">Gb~c</td><td class="ung">Gc~c</td></tr>
</table>

Mehr zum Thema th können Sie in Tabellen in HTML erfahren. Weiteres zum hier verwendeten Befehl th ist in der HTML Referenz unter <th> genau gezeigt.

Wechsel der Umrandung bei Hover von HTML-Tag button

Die Rahmenfarbe soll sich von Farbe beige auf Farbwert #ff8c00 ändern, wenn man mit der Maus auf <button> zeigt. Wir bereiten zunächst eine Darstellung von <button> in Farbe beige vor.

In diesem Beispiel umranden wir <button> mit einem 1 Pixel dicken, herausstehenden Rahmen in Farbe beige.

<style type="text/css"><!--
  button { 
    border-color: beige; 
    border-style: outset; 
    border-width: 1px;
  }
//-->
</style>

Jetzt stellen wir ein, dass sich bei Mausberührung die Rahmenfarbe auf #ff8c00 ändert.

<style type="text/css"><!--
  button: hover { 
    border-color: #ff8c00;
  }
//-->
</style>

Mehr zum Thema lesen Sie in Formulare in HTML. Mehr zum Tag button finden Sie in der HTML Referenz unter <button>.