55 lines
2.4 KiB
HTML
55 lines
2.4 KiB
HTML
<!doctype html>
|
|
<html>
|
|
<head>
|
|
<style>
|
|
p { /* Ref-test must fix into 800*600, keep the margins small. */
|
|
margin: 2px;
|
|
}
|
|
|
|
[data-webkit] {
|
|
background-color: lightgrey;
|
|
color: blue;
|
|
border: none;
|
|
}
|
|
|
|
[data-webkit~="is" i] {
|
|
color: white;
|
|
}
|
|
[data-webkit~="is"] {
|
|
color: red;
|
|
}
|
|
|
|
[data-webkit|="is" i] {
|
|
border: 5px dashed orange;
|
|
background-color: lime;
|
|
}
|
|
[data-webkit|="is"] {
|
|
border: 2px solid purple;
|
|
}
|
|
|
|
/* This rule is invalid. */
|
|
[data-webkit i] {
|
|
background-color: red;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<p>This test verify basic styling of element using case-insensitive attribute value matching (e.g. [foo=bar i]). If the test succeed, each paragraph should be styled according to its description.</p>
|
|
<p data-webkit>Light grey background, blue text, no border.</p>
|
|
<p data-webkit="is fast">Light grey background, red text, no border.</p>
|
|
<p data-webkit="IS fast">Light grey background, white text, no border.</p>
|
|
<p data-webkit="IS fast is FAST">Light grey background, red text, no border.</p>
|
|
<p data-webkit="is FAST">Light grey background, red text, no border.</p>
|
|
<p data-webkit="is">Green background, red text, solid purple border.</p>
|
|
<p data-webkit="IS">Green background, white text, dashed orange border.</p>
|
|
<p data-webkit="Is">Green background, white text, dashed orange border.</p>
|
|
<p data-webkit="Fast">Light grey background, blue text, no border.</p>
|
|
<p data-webkit="fast">Light grey background, blue text, no border.</p>
|
|
<p data-webkit="FAST">Light grey background, blue text, no border.</p>
|
|
<p data-webkit="is-Fast">Green background, blue text, solid purple border.</p>
|
|
<p data-webkit="Is-Fast">Green background, blue text, dashed orange border.</p>
|
|
<p data-webkit="Is-fast">Green background, blue text, dashed orange border.</p>
|
|
<p data-webkit="is-Fast Is-Fast">Green background, blue text, solid purple border.</p>
|
|
<p data-webkit="Is-fast Is-Fast">Green background, blue text, dashed orange border.</p>
|
|
</body>
|
|
</html> |