Home >Web Front-end >HTML Tutorial >How to achieve a background color gradient from the middle to both sides? _html/css_WEB-ITnose
How to achieve a background color gradient from the middle to both sides? _html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 11:51:335577browse
-webkit-linear-gradient( bottom,transparent ,#000 100%)
In this way, the gradient of the background color is realized. It is hoped that the background color will be dark in the middle and gradually become transparent upward and downward, css How to write it?
Reply to discussion (solution)
FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#fff,endColorStr=#000 ); /*IE 6 7 8*/
background: -ms-linear-gradient(top, #fff, #000); /* IE 10 */
background:-moz -linear-gradient(top,#fff,#000);/*Firefox*/
background:-webkit-gradient(linear, 0% 0%, 0% 100%,from(#fff), to(#000));/*Google*/
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fff), to(#000)); /* Safari 4-5, Chrome 1-9*/
background: -webkit-linear-gradient(top, #fff, #000); /*Safari5.1 Chrome 10 */
background: -o-linear-gradient(top, #fff, #000); /*Opera 11.10 */