Ich brauche etwas Hilfe hinzufügen eines Farbverlaufs zu einer Textur

Question

Ich möchte versuchen, einen zentrierten Farbverlauf zur Textur in den Link unten hinzuzufügen.

http://lea.verou.me/css3patterns/#carbon-fibre

würde mir jede Seite gefallen # 2a2b2c und das Zentrum zu sein, auf Platz # 555454 zu starten.

Mein CSS ist ein bisschen schwach, kann mir jemand helfen und vielleicht aufzeigen, wo ich lernen könnte, wie diese Methoden funktionieren? diese

Dank

Answer 1

.myDiv { 
 
\t margin: 0; 
 
\t height: 500px; 
 
\t width: 500px; 
 
\t background: 
 
\t radial-gradient(black 15%, transparent 16%) 0 0, 
 
\t radial-gradient(black 15%, transparent 16%) 8px 8px, 
 
\t radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 0 1px, 
 
\t radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 8px 9px; 
 
\t background-color:#282828; 
 
\t background-size:16px 16px; 
 
\t position: relative; 
 
} 
 

 
.myDiv:after { 
 
\t content: ''; 
 
\t position: absolute; 
 
\t background: red; /* For browsers that do not support gradients */ 
 
\t background: -webkit-radial-gradient(#2a2b2c , #555454); /* Safari 5.1 to 6.0 */ 
 
\t background: -o-radial-gradient(#2a2b2c , #555454); /* For Opera 11.6 to 12.0 */ 
 
\t background: -moz-radial-gradient(#2a2b2c , #555454); /* For Firefox 3.6 to 15 */ 
 
\t background: radial-gradient(#2a2b2c , #555454); /* Standard syntax */ 
 
\t height: 500px; 
 
\t width: 500px; 
 
\t opacity: 0.7 
 
}

<div class="myDiv"></div>

Answer 2

Versuchen:

background: rgba(42,43,44,1); 
background: -moz-linear-gradient(left, rgba(42,43,44,1) 0%, rgba(85,84,84,1) 50%, rgba(42,43,44,1) 100%); 
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(42,43,44,1)), color-stop(50%, rgba(85,84,84,1)), color-stop(100%, rgba(42,43,44,1))); 
background: -webkit-linear-gradient(left, rgba(42,43,44,1) 0%, rgba(85,84,84,1) 50%, rgba(42,43,44,1) 100%); 
background: -o-linear-gradient(left, rgba(42,43,44,1) 0%, rgba(85,84,84,1) 50%, rgba(42,43,44,1) 100%); 
background: -ms-linear-gradient(left, rgba(42,43,44,1) 0%, rgba(85,84,84,1) 50%, rgba(42,43,44,1) 100%); 
background: linear-gradient(to right, rgba(42,43,44,1) 0%, rgba(85,84,84,1) 50%, rgba(42,43,44,1) 100%); 
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#2a2b2c', endColorstr='#2a2b2c', GradientType=1); 

Verwenden Sie diese Website http://www.cssmatic.com/gradient-generator

und dies für belebtes gradinet: https://www.gradient-animator.com/