
Line 1: background hyphen image colon linear hyphen gradient open parenthesis green comma white close parenthesis semicolon. linear hyphen gradient is labeled as C S S function. green and white are labeled color stop. Output 1: A square labeled shaded green is shown. The intensity of green decreases from top to bottom and the square is shaded white at the bottom. Note: default direction is top to bottom.
Line 2: background hyphen image colon linear hyphen gradient open parenthesis to top left comma white comma blue close parenthesis semicolon. to top left is labeled destination direction. Output 2: A square labeled blue is shown. The intensity of blue decreases from the top left to bottom right. The right bottom of the square is shaded white.
Line 3: background hyphen image colon linear hyphen gradient open parenthesis 90 deg comma green 50 percent comma orange comma blue close parenthesis semicolon. 90 deg is labeled angle, green 50 percent comma orange comma blue is labeled you can specify multiple color stops, and 50 percent is labeled size of color stop. Output 3: A square labeled C is shown. Three-fourth of the square is shaded green from the left. The color transforms to orange after crossing the vertical half of the square and then transforms to blue after crossing three-fourth of the vertical area of the square.
Line 4: background hyphen image colon repeating hyphen linear hyphen gradient open parenthesis 135 deg comma black 0 comma black dot 75 e m comma green 0 comma green 2 e m close parenthesis semicolon. black 0 comma black dot 75 e m is labeled first a black stripe from 0 to 0.75 e m. green 0 comma green 2 e m is labeled then a green stripe from 0.75 to 2.75 e m. Output 4: A square labeled D is shown. Thick stripes of black and green are drawn diagonally over the square, such that the thickness of the green stripes are more than the black stripes.
Line 5: background hyphen image colon radial hyphen gradient open parenthesis circle comma yellow comma red close parenthesis semicolon. circle is labeled shape. Output 5: A square labeled E is shown. The center of the square is shaded in a circle of yellow. The intensity of yellow decreases and transforms to orange as it moves outward and then transforms to red.
Back