我想嘗試在下面的鏈接中爲紋理添加居中漸變。我需要一些幫助在紋理中添加漸變
http://lea.verou.me/css3patterns/#carbon-fibre
我想每一面是#2a2b2c和中心#555454啓動。
我的CSS有點虛弱,有人可以幫助我,也許指出我可以在哪裏瞭解這些方法的工作方式?
感謝
我想嘗試在下面的鏈接中爲紋理添加居中漸變。我需要一些幫助在紋理中添加漸變
http://lea.verou.me/css3patterns/#carbon-fibre
我想每一面是#2a2b2c和中心#555454啓動。
我的CSS有點虛弱,有人可以幫助我,也許指出我可以在哪裏瞭解這些方法的工作方式?
感謝
.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>
試試這個:
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);
使用本網站http://www.cssmatic.com/gradient-generator
這對於動畫gradinet:https://www.gradient-animator.com/
嘿對不起,我添加了錯誤的鏈接.. –
我想添加漸變到這個,http://lea.verou.me/css3patterns/#carbon-fibre –
我的顏色已經出來,但我可以調整,謝謝!!! –
歡迎您! @Brad_ZA –