Monday, 15 February 2010

Creating gradient lines in CSS -


The question, if I want to create gradient lines, similar to the lines that appear on AT & AM, the T drop down menu Which separates the menu item, how do I go about it? I want to make a similar effect on a menu that I'm coding, and I do not want to use images. Is there a way to get it in css? Help much appreciated! Thank you.

You can use a GUI, just copy the CSS into your code:

Example:

  #div {/ * IE10 Consumer Preview * / Background Image: -MMS-Linear-Slope (Below, #FFFFFF0%, # 00A3EF100% ); / * Mozilla Firefox * / background-image: -Mo-linear-shield (bottom, #FFFFFF 0%, # 00A3EF100%); / * Opera / background-image: -o-linear-shield (bottom, #FFFFF0%, # 00A3EF100%); / * WebKit (Safari / Chrome 10) * / Background image: -WebKit-Gradient (Linear, Left Down, Left Top, Color-stop (0, #FFFFFF), Color-stop (1, # 00A3EF) ); / * WebKit (Chrome 11+) * / background-image: -webkit-linear-gradient (bottom, #FFFFFF 0%, # 00A3EF 100%); / * W3C markup, IE 10 release preview * / background-image: linear-shield (top, #FFFFF0%, # 00A3EF100%); }    

No comments:

Post a Comment