css/css-values/attr-color-valid.html - external/w3c/web-platform-tests - Git at Google

 <!DOCTYPE html>
 <html>
 <head>
 	<meta charset="utf-8">
 	<title>
 		CSS Values and Units Test:
 		Attribute references (colors)
 	</title>
 	<meta name="assert" content="
 		The value of the reference attribute is used correctly in the layout when it's a color.
 	" />

 	<link
 		rel="author"
 		title="François REMY"
 		href="mailto:fremycompany.developer@yahoo.fr"
 	/ >

 	<link rel="help" href="http://www.w3.org/TR/css3-values/#attr-notation"/>

 	<link
 		rel="match"
 		href="reference/200-200-green.html"
 	/>

 	<style type="text/css">

 			html, body { margin: 0px; padding: 0px; }

 			html { background: white; overflow: hidden; }
 			#outer { position: relative; background: red; width: 200px; height: 200px; }

 			#outer { background: attr(data-test color); }

 	</style>

 </head>
 <body>

 	<div id="outer" data-test="green"></div>

 </body>
 </html>
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<title>
	CSS Values and Units Test:
	Attribute references (colors)
	</title>
	<meta name="assert" content="
	The value of the reference attribute is used correctly in the layout when it's a color.
	" />

	<link
	rel="author"
	title="François REMY"
	href="mailto:fremycompany.developer@yahoo.fr"
	/ >

	<link rel="help" href="http://www.w3.org/TR/css3-values/#attr-notation"/>

	<link
	rel="match"
	href="reference/200-200-green.html"
	/>

	<style type="text/css">

	html, body { margin: 0px; padding: 0px; }

	html { background: white; overflow: hidden; }
	#outer { position: relative; background: red; width: 200px; height: 200px; }

	#outer { background: attr(data-test color); }

	</style>

	</head>
	<body>

	<div id="outer" data-test="green"></div>

	</body>
	</html>