Links in demo updated - Radio in all styles adapted
-----

Alternative Headerbackgrounds mit Code

Gesperrt
Forum Member
Site Admin
Beiträge: 649
Registriert: 3. Apr 2019, 17:36
Vorname: Jutta
Dein Land: Schweiz
Wohnort: Zuchwil / SO
Kontaktdaten:

Alternative Headerbackgrounds mit Code

Beitrag von Forum Member » 14. Apr 2019, 14:31

Simple-türkis
simple.jpg

Code: Alles auswählen

	background: -moz-linear-gradient(90deg, #008080 0%, #008080 1%, #99DAFF 49%, #008080 100%); /* ff3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #008080), color-stop(51%, #99DAFF), color-stop(99%, #008080), color-stop(100%, #008080)); /* safari4+,chrome */
	background: -webkit-linear-gradient(90deg, #008080 0%, #008080 1%, #99DAFF 49%, #008080 100%); /* safari5.1+,chrome10+ */
	background: -o-linear-gradient(90deg, #008080 0%, #008080 1%, #99DAFF 49%, #008080 100%); /* opera 11.10+ */
	background: -ms-linear-gradient(90deg, #008080 0%, #008080 1%, #99DAFF 49%, #008080 100%); /* ie10+ */
	background: linear-gradient(0deg, #008080 0%, #008080 1%, #99DAFF 49%, #008080 100%); /* w3c */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#008080', endColorstr='#008080',GradientType=0 ); /* ie6-9 */ 
Blue
blue.jpg

Code: Alles auswählen

	background: rgb(58,78,213); /* Old browsers */
	background: -moz-linear-gradient(top, rgb(58,78,213) 0%, rgb(58,157,213) 32%, rgb(58,207,213) 51%, rgb(58,157,213) 70%, rgb(58,78,213) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgb(58,78,213) 0%,rgb(58,157,213) 32%,rgb(58,207,213) 51%,rgb(58,157,213) 70%,rgb(58,78,213) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgb(58,78,213) 0%,rgb(58,157,213) 32%,rgb(58,207,213) 51%,rgb(58,157,213) 70%,rgb(58,78,213) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3a4ed5', endColorstr='#3a4ed5',GradientType=0 ); /* IE6-9 */
Sun
sun.jpg

Code: Alles auswählen

	background: rgb(117,34,1); /* Old browsers */
	background: -moz-linear-gradient(top, rgb(117,34,1) 0%, rgb(191,110,78) 24%, rgb(240,183,161) 51%, rgb(191,110,78) 82%, rgb(117,34,1) 99%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgb(117,34,1) 0%,rgb(191,110,78) 24%,rgb(240,183,161) 51%,rgb(191,110,78) 82%,rgb(117,34,1) 99%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgb(117,34,1) 0%,rgb(191,110,78) 24%,rgb(240,183,161) 51%,rgb(191,110,78) 82%,rgb(117,34,1) 99%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#752201', endColorstr='#752201',GradientType=0 ); /* IE6-9 */	
Silver
silver.jpg

Code: Alles auswählen

	
	background: -moz-linear-gradient(90deg, #000000 0%, #000000 1%, #ffffff 47%, #000000 100%); /* ff3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #000000), color-stop(53%, #ffffff), color-stop(99%, #000000), color-stop(100%, #000000)); /* safari4+,chrome */
	background: -webkit-linear-gradient(90deg, #000000 0%, #000000 1%, #ffffff 47%, #000000 100%); /* safari5.1+,chrome10+ */
	background: -o-linear-gradient(90deg, #000000 0%, #000000 1%, #ffffff 47%, #000000 100%); /* opera 11.10+ */
	background: -ms-linear-gradient(90deg, #000000 0%, #000000 1%, #ffffff 47%, #000000 100%); /* ie10+ */
	background: linear-gradient(0deg, #000000 0%, #000000 1%, #ffffff 47%, #000000 100%); /* w3c */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000',GradientType=0 ); /* ie6-9 */ 
Sunshine
sunshine.jpg

Code: Alles auswählen

	
	background: -moz-linear-gradient(90deg, #800000 0%, #ffff00 50%, #800000 100%); /* ff3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #800000), color-stop(50%, #ffff00), color-stop(100%, #800000)); /* safari4+,chrome */
	background: -webkit-linear-gradient(90deg, #800000 0%, #ffff00 50%, #800000 100%); /* safari5.1+,chrome10+ */
	background: -o-linear-gradient(90deg, #800000 0%, #ffff00 50%, #800000 100%); /* opera 11.10+ */
	background: -ms-linear-gradient(90deg, #800000 0%, #ffff00 50%, #800000 100%); /* ie10+ */
	background: linear-gradient(0deg, #800000 0%, #ffff00 50%, #800000 100%); /* w3c */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#800000', endColorstr='#800000',GradientType=0 ); /* ie6-9 */ 
Mixte
mixte.jpg

Code: Alles auswählen

	background: -moz-linear-gradient(90deg, #008080 0%, #FFFFFF 25%, #05C1FF 50%, #FFFFFF 75%, #005757 100%); /* ff3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #005757), color-stop(25%, #FFFFFF), color-stop(50%, #05C1FF), color-stop(75%, #FFFFFF), color-stop(100%, #008080)); /* safari4+,chrome */
	background: -webkit-linear-gradient(90deg, #008080 0%, #FFFFFF 25%, #05C1FF 50%, #FFFFFF 75%, #005757 100%); /* safari5.1+,chrome10+ */
	background: -o-linear-gradient(90deg, #008080 0%, #FFFFFF 25%, #05C1FF 50%, #FFFFFF 75%, #005757 100%); /* opera 11.10+ */
	background: -ms-linear-gradient(90deg, #008080 0%, #FFFFFF 25%, #05C1FF 50%, #FFFFFF 75%, #005757 100%); /* ie10+ */
	background: linear-gradient(0deg, #008080 0%, #FFFFFF 25%, #05C1FF 50%, #FFFFFF 75%, #005757 100%); /* w3c */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#005757', endColorstr='#008080',GradientType=0 ); /* ie6-9 */ 
Red
red.jpg

Code: Alles auswählen

	background: -moz-linear-gradient(90deg, #000000 0%, #ff0000 48%, #000000 100%); /* ff3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #000000), color-stop(52%, #ff0000), color-stop(100%, #000000)); /* safari4+,chrome */
	background: -webkit-linear-gradient(90deg, #000000 0%, #ff0000 48%, #000000 100%); /* safari5.1+,chrome10+ */
	background: -o-linear-gradient(90deg, #000000 0%, #ff0000 48%, #000000 100%); /* opera 11.10+ */
	background: -ms-linear-gradient(90deg, #000000 0%, #ff0000 48%, #000000 100%); /* ie10+ */
	background: linear-gradient(0deg, #000000 0%, #ff0000 48%, #000000 100%); /* w3c */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000',GradientType=0 ); /* ie6-9 */ 

Gesperrt

Zurück zu „FAQ“