-ms-repeating-linear-gradient() function

Deprecated. (See Remarks.) Specifies a repeating linear gradient, in which colors transition smoothly from a starting point to one or more color stops, repeating indefinitely.

Syntax

-ms-repeating-linear-gradient

( <angle> <starting-point> , <stop-color> <stop-offset> , <stop-color> <stop-offset> , ...)

Parameters

angle

Optional. The angle the gradient-line should assume, expressed as a number followed by an angle units designator (deg, grad, rad, or turn). For more information about supported angle units, see CSS Values and Units. For instance, 0deg points upwards, 90deg points toward the right, and positive angles go clockwise.

If no angle is provided, the gradient line starts in the corner or side specified by <starting-point> and ends in the opposite corner or side.

starting-point

Optional value that specifies a starting point for the gradient. This value can be one or two of the following keywords.

ValueMeaning
left

First value only. Indicates gradient starts from left.

right

First value only. Indicates gradient starts from right.

top

Default. Second value only. Indicates gradient starts from top.

bottom

Second value only. Indicates gradient starts from bottom.

 

stop-color

Required. Defines the color component of a stop point for the gradient. Each stop point has its own designated color, and the area between each point is filled with a continuous color transition from one to the other. This value can be any supported color value, as described in CSS Values and Units.

stop-offset

Optional percentage or decimal value that indicates where along the gradient line to place the color stop.

Remarks

Important  The -ms-repeating-linear-gradient() function has been superseded by the repeating-linear-gradient function, which does not require the "-ms-" prefix and has a different syntax. Though the -ms-repeating-linear-gradient() function is still recognized by Internet Explorer 10, Microsoft encourages you to use the repeating-linear-gradient function, as it is compliant with the latest version of the CSS Image Values and Replaced Content Module Level 3 specification.

Once the last stop point has been reached, the gradient transitions to the first stop point and repeats.

The syntax for the -ms-repeating-linear-gradient() function is identical to that of the -ms-linear-gradient() function.

Examples

The following declaration creates a repeating linear gradient.


background-image: -ms-repeating-linear-gradient(top right, #FFF133 0%, #16D611 50%, #00A3EF 80%);

Image of a repeating linear gradient in a rectangle.

 

 

Send comments about this topic to Microsoft

Build date: 9/6/2012

Community Additions

Show:
© 2014 Microsoft