mirror of
https://github.com/hail2u/vim-css3-syntax.git
synced 2025-12-08 19:44:45 +08:00
Add test for HTML
This commit is contained in:
558
test/test.html
Normal file
558
test/test.html
Normal file
@@ -0,0 +1,558 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width">
|
||||
|
||||
<title>vim-css3-syntax</title>
|
||||
|
||||
<link rel="stylesheet" href="http://hail2u.net/styles/natural.min.css">
|
||||
<style>
|
||||
.align {
|
||||
justify-self: safe;
|
||||
justify-content: true;
|
||||
justify-items: self-start;
|
||||
align-self: self-end;
|
||||
align-content: flex-start;
|
||||
align-items: flex-end;
|
||||
display: space-around;
|
||||
display: space-between;
|
||||
display: space-evenly;
|
||||
}
|
||||
|
||||
.animations {
|
||||
animation: forwards;
|
||||
animation-delay: backwards;
|
||||
animation-direction: running;
|
||||
animation-duration: paused;
|
||||
animation-fill-mode: alternate-reverse;
|
||||
animation-iteration-count: auto;
|
||||
animation-name: auto;
|
||||
animation-play-state: auto;
|
||||
animation-timing-function: auto;
|
||||
}
|
||||
|
||||
.background {
|
||||
background-clip: space;
|
||||
background-origin: round;
|
||||
background-size: local;
|
||||
border-image: fill;
|
||||
border-image-source: stretch;
|
||||
border-image-slice: clone;
|
||||
border-image-width: slice;
|
||||
border-image-outset: padding-box;
|
||||
border-image-repeat: border-box;
|
||||
border-radius: content-box;
|
||||
border-top-right-radius: auto;
|
||||
border-bottom-right-radius: auto;
|
||||
border-bottom-left-radius: auto;
|
||||
border-top-left-radius: auto;
|
||||
box-decoration-break: auto;
|
||||
box-shadow: auto;
|
||||
}
|
||||
|
||||
.box {
|
||||
overflow-style: scrollbar;
|
||||
overflow-x: panner;
|
||||
overflow-y: move;
|
||||
rotation-point: marquee;
|
||||
display: ruby;
|
||||
display: ruby-base;
|
||||
display: ruby-text;
|
||||
display: ruby-base-group;
|
||||
display: ruby-text-group;
|
||||
display: no-display;
|
||||
display: no-content;
|
||||
}
|
||||
|
||||
.break {
|
||||
break-after: auto;
|
||||
break-before: auto;
|
||||
break-inside: auto;
|
||||
}
|
||||
|
||||
.cascade {
|
||||
all: unset;
|
||||
}
|
||||
|
||||
.colors {
|
||||
opacity: rgba(0, 0, 0, 1);
|
||||
display: hsla(0, 0, 0, 1);
|
||||
display: currentColor;
|
||||
}
|
||||
|
||||
.compositing {
|
||||
mix-blend-mode: multiply;
|
||||
isolation: screen;
|
||||
background-blend-mode: overlay;
|
||||
display: darken;
|
||||
display: lighten;
|
||||
display: color-dodge;
|
||||
display: color-burn;
|
||||
display: hard-light;
|
||||
display: soft-light;
|
||||
display: difference;
|
||||
display: exclusion;
|
||||
display: hue;
|
||||
display: saturation;
|
||||
display: color;
|
||||
display: luminosity;
|
||||
}
|
||||
|
||||
.content {
|
||||
move-to: inhibit;
|
||||
page-policy: here;
|
||||
display: first;
|
||||
display: last;
|
||||
}
|
||||
|
||||
.counter-styles {
|
||||
negative: disclosure-open;
|
||||
prefix: disclosure-closed;
|
||||
suffix: simp-chinese-informal;
|
||||
range: simp-chinese-formal;
|
||||
pad: trad-chinese-informal;
|
||||
fallback: trad-chinese-formal;
|
||||
symbols: ethiopic-numeric;
|
||||
additive-symbols: symbols("*" "\2020" "\2021" "\A7");
|
||||
speak-as: auto;
|
||||
}
|
||||
|
||||
.exclusions {
|
||||
wrap-flow: minimum;
|
||||
wrap-through: maximum;
|
||||
}
|
||||
|
||||
.flexbox {
|
||||
order: flex;
|
||||
flex: row;
|
||||
flex-basis: wrap;
|
||||
flex-direction: inline-flex;
|
||||
flex-flow: row-reverse;
|
||||
flex-grow: column-reverse;
|
||||
flex-shrink: wrap-reverse;
|
||||
flex-wrap: auto;
|
||||
}
|
||||
|
||||
.fonts {
|
||||
font-feature-settings: common-ligatures;
|
||||
font-kerning: no-common-ligatures;
|
||||
font-language-override: discretionary-ligatures;
|
||||
font-synthesis: no-discretionary-ligatures;
|
||||
font-variant-alternates: historical-ligatures;
|
||||
font-variant-caps: no-historical-ligatures;
|
||||
font-variant-east-asian: contextual;
|
||||
font-variant-ligatures: no-contextual;
|
||||
font-variant-numeric: stylistic(feature-value-name);
|
||||
font-variant-position: historical-forms;
|
||||
display: styleset(feature-value-name #);
|
||||
display: character-variant(feature-vlue-name #);
|
||||
display: swash(feature-value-name);
|
||||
display: ornaments(feature-value-name);
|
||||
display: annotation(feature-value-name);
|
||||
display: all-small-caps;
|
||||
display: petite-caps;
|
||||
display: all-petite-caps;
|
||||
display: unicase;
|
||||
display: titling-caps;
|
||||
display: lining-nums;
|
||||
display: oldstyle-nums;
|
||||
display: proportional-nums;
|
||||
display: tabular-nums;
|
||||
display: diagonal-fractions;
|
||||
display: stacked-fractions;
|
||||
display: ordinal;
|
||||
display: slashed-zero;
|
||||
display: jis78;
|
||||
display: jis83;
|
||||
display: jis90;
|
||||
display: jis04;
|
||||
display: simplified;
|
||||
display: traditional;
|
||||
display: proportional-width;
|
||||
}
|
||||
|
||||
.gcpm {
|
||||
bleed: target-counter(attr(href, url), page, decimal);
|
||||
marks: target-text(attr(href), content());
|
||||
bookmark-label: open;
|
||||
bookmark-level: closed;
|
||||
bookmark-state: target-text(attr(href), content());
|
||||
bookmark-target: crop;
|
||||
float-offset: cross;
|
||||
string-set: auto;
|
||||
}
|
||||
|
||||
.grid-layout {
|
||||
grid-template-columns: grid;
|
||||
grid-template-rows: inline-grid;
|
||||
grid-template-areas: minmax(0, 1);
|
||||
grid-template: repeat(4);
|
||||
grid-auto-columns: 0.2fr;
|
||||
grid-auto-rows: subgrid;
|
||||
grid-auto-flow: rows;
|
||||
grid-auto-position: columns;
|
||||
grid: dense;
|
||||
grid-row-start: span;
|
||||
grid-column-start: auto;
|
||||
grid-row-end: auto;
|
||||
grid-column-end: auto;
|
||||
grid-column: auto;
|
||||
grid-row: auto;
|
||||
grid-area: auto;
|
||||
}
|
||||
|
||||
.hyperlinks {
|
||||
target: current;
|
||||
target-name: new;
|
||||
target-new: modal;
|
||||
target-position: window;
|
||||
display: tab;
|
||||
display: front;
|
||||
display: back;
|
||||
}
|
||||
|
||||
.images {
|
||||
object-fit: contain;
|
||||
object-position: cover;
|
||||
image-resolution: snap;
|
||||
image-orientation: scale-down;
|
||||
display: from-image;
|
||||
display: image("sprite.svg#xywh=40,0,20,20");
|
||||
display: linear-gradient(to bottom, yellow, blue);
|
||||
display: radial-gradient(farthest-corner at 50% 50%, yellow, green);
|
||||
display: repeating-linear-gradient(to bottom, yellow, blue);
|
||||
display: repeating-radial-gradient(farthest-corner at 50% 50%, yellow, green);
|
||||
}
|
||||
|
||||
.layout::slot(b) {
|
||||
display: same;
|
||||
}
|
||||
|
||||
.linebox {
|
||||
alignment-adjust: central;
|
||||
alignment-baseline: mathematical;
|
||||
baseline-shift: before-edge;
|
||||
dominate-baseline: after-edge;
|
||||
drop-initial-after-adjust: text-before-edge;
|
||||
drop-initial-after-align: text-after-edge;
|
||||
drop-initial-before-adjust: use-script;
|
||||
drop-initial-before-align: caps-height;
|
||||
drop-initial-size: exclude-ruby;
|
||||
drop-initial-value: include-ruby;
|
||||
inline-box-align: consider-shift;
|
||||
line-stacking: disregard-shift;
|
||||
line-stacking-ruby: inline-line-height;
|
||||
line-stacking-shift: block-line-height;
|
||||
line-stacking-strategy: max-height;
|
||||
text-height: grid-height;
|
||||
display: font-size;
|
||||
display: text-size;
|
||||
display: max-size;
|
||||
}
|
||||
|
||||
.lists::marker {
|
||||
display: auto;
|
||||
}
|
||||
|
||||
.marquee {
|
||||
marquee-direction: forward;
|
||||
marquee-play-count: reverse;
|
||||
marquee-speed: infinite;
|
||||
marquee-style: slide;
|
||||
display: alternate;
|
||||
display: marquee-line;
|
||||
display: marquee-block;
|
||||
}
|
||||
|
||||
.masking {
|
||||
mask-image: alpha;
|
||||
mask-source-type: luminance;
|
||||
mask-repeat: no-clip;
|
||||
mask-position: nonzero;
|
||||
mask-clip: evenodd;
|
||||
mask-origin: auto;
|
||||
mask-size: auto;
|
||||
mask: auto;
|
||||
mask-type: auto;
|
||||
mask-box-image-source: auto;
|
||||
mask-box-image-slice: auto;
|
||||
mask-box-image-width: auto;
|
||||
mask-box-image-outset: auto;
|
||||
mask-box-image-repeat: auto;
|
||||
mask-box-image: auto;
|
||||
clip-path: auto;
|
||||
clip-rule: auto;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 999px) {
|
||||
.mediaqueries {
|
||||
display: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.multicol {
|
||||
columns: page;
|
||||
column-count: column;
|
||||
column-fill: balance;
|
||||
column-gap: avoid-column;
|
||||
column-rule: avoid-page;
|
||||
column-rule-color: auto;
|
||||
column-rule-style: auto;
|
||||
column-rule-width: auto;
|
||||
column-span: auto;
|
||||
column-width: auto;
|
||||
}
|
||||
|
||||
.overflow {
|
||||
max-lines: paged-x;
|
||||
display: paged-y;
|
||||
display: paged-x-controls;
|
||||
display: paged-y-controls;
|
||||
display: fragments;
|
||||
}
|
||||
|
||||
.preslev {
|
||||
presentation-level: increment;
|
||||
}
|
||||
|
||||
.regions:region(p),
|
||||
.regions::region(p) {
|
||||
flow-from: break;
|
||||
flow-into: region;
|
||||
region-fragment: avoid-region;
|
||||
display: element;
|
||||
display: content;
|
||||
}
|
||||
|
||||
.ruby {
|
||||
ruby-merge: ruby-text-container;
|
||||
ruby-align: inter-character;
|
||||
ruby-position: ruby-base-container;
|
||||
}
|
||||
|
||||
.selectors:not([DISABLED]),
|
||||
.selectors:matches(:hover, :focus),
|
||||
.selectors:any-link,
|
||||
.selectors:local-link,
|
||||
.selectors:local-link(0),
|
||||
.selectors:target,
|
||||
.selectors:scope,
|
||||
.selectors:current,
|
||||
.selectors:current(p, li, dt, dd),
|
||||
.selectors:past,
|
||||
.selectors:future,
|
||||
.selectors:enabled,
|
||||
.selectors:disabled,
|
||||
.selectors:checked,
|
||||
.selectors:indeterminate,
|
||||
.selectors:default,
|
||||
.selecors:in-range,
|
||||
.selectors:out-of-range,
|
||||
.selectors:required,
|
||||
.selectors:optional,
|
||||
.selectors:read-only,
|
||||
.selectors:read-write,
|
||||
.selectors:root,
|
||||
.selectors:empty,
|
||||
.selectors:nth-child(2n+1),
|
||||
.selectors:last-child,
|
||||
.selectors:nth-last-child(-n+2),
|
||||
.selectors:only-child,
|
||||
.selectors:first-of-type,
|
||||
.selectors:nth-of-type(2n+1),
|
||||
.selectors:last-of-type,
|
||||
.selectors:nth-last-of-type(n+2),
|
||||
.selectors:only-of-type,
|
||||
.selectors:nth-match(2n+1),
|
||||
.selectors:nth-last-match(-n+2),
|
||||
.selectors:column(p, li, dt, dd),
|
||||
.selectors:nth-column(2n+1),
|
||||
.selectors:nth-last-column(-n+2) {
|
||||
display: auto;
|
||||
}
|
||||
|
||||
.shapes {
|
||||
shape-image-threshold: rectangle(1px 1px 1198px 398px);
|
||||
shape-inside: inset-rectangle(400px 100px 400px 200px);
|
||||
shape-outside: circle(600px 200px 100px);
|
||||
display: ellipse(0 0 250px 100px);
|
||||
display: polygon(350px,75px 379px,161px 469px,161px 397px,215px 423px,301px 350px,250px 277px,301px 303px,215px 231px,161px 321px,161px);
|
||||
}
|
||||
|
||||
.sizing {
|
||||
display: max-content;
|
||||
display: fit-content;
|
||||
display: fill-available;
|
||||
display: repudiate-floats;
|
||||
display: contain-floats;
|
||||
}
|
||||
|
||||
@supports (display: auto) or
|
||||
(display: auto) not
|
||||
(display: auto) {
|
||||
.supports {
|
||||
display: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.text {
|
||||
hyphens: manual;
|
||||
line-break: loose;
|
||||
overflow-wrap: strict;
|
||||
tab-size: match-parent;
|
||||
display: hanging;
|
||||
display: each-line;
|
||||
display: full-width;
|
||||
}
|
||||
|
||||
.text-decor-3 {
|
||||
text-decoration-color: filled;
|
||||
text-decoration-line: dot;
|
||||
text-decoration-skip: triangle;
|
||||
text-decoration-style: sesame;
|
||||
text-emphasis: objects;
|
||||
text-emphasis-color: ink;
|
||||
text-emphasis-position: edges;
|
||||
text-emphasis-style: wavy;
|
||||
display: alphabetic;
|
||||
display: spaces;
|
||||
display: box-decoration;
|
||||
display: under;
|
||||
display: over;
|
||||
}
|
||||
|
||||
.transforms {
|
||||
backface-visibility: flat;
|
||||
perspective: preserve-3d;
|
||||
perspective-origin: matrix(1);
|
||||
transform: matrix3d(1);
|
||||
transform-origin: translate(1);
|
||||
transform-style: translate3d(1);
|
||||
display: translateX(1);
|
||||
display: translateY(1);
|
||||
display: translateZ(1);
|
||||
display: scale(1);
|
||||
display: scale3d(1);
|
||||
display: scaleX(1);
|
||||
display: scaleY(1);
|
||||
display: scaleZ(1);
|
||||
display: rotate(1);
|
||||
display: rotate3d(1);
|
||||
display: rotateX(1);
|
||||
display: rotateY(1);
|
||||
display: rotateZ(1);
|
||||
display: skew(1);
|
||||
display: skewX(1);
|
||||
display: skewY(1);
|
||||
display: perspective(1);
|
||||
}
|
||||
|
||||
.transitions {
|
||||
transition: linear;
|
||||
transition-property: ease;
|
||||
transition-duration: ease-in;
|
||||
transition-timing-function: ease-out;
|
||||
transition-delay: ease-in-out;
|
||||
display: step-start;
|
||||
display: step-end;
|
||||
display: steps(1, start);
|
||||
display: cubic-bezier(0.25, 0.1, 0.25, 1.0);
|
||||
}
|
||||
|
||||
.ui {
|
||||
icon: active;
|
||||
resize: inactive;
|
||||
box-sizing: disabled;
|
||||
ime-mode: root;
|
||||
nav-index: horizontal;
|
||||
nav-up: vertical;
|
||||
nav-right: clip;
|
||||
nav-down: ellipsis;
|
||||
nav-left: auto;
|
||||
outline-offset: auto;
|
||||
}
|
||||
|
||||
.values {
|
||||
display: 1ch;
|
||||
display: 1rem;
|
||||
display: 1vw;
|
||||
display: 1vh;
|
||||
display: 1vmin;
|
||||
display: 1turn;
|
||||
display: 1dpi;
|
||||
display: 1dpcm;
|
||||
display: 1dppx;
|
||||
display: calc(100%/3 - 2*1em - 2*1px);
|
||||
display: toggle(italic, normal);
|
||||
display: initial;
|
||||
}
|
||||
|
||||
.variables {
|
||||
var-foo: var(foo);
|
||||
}
|
||||
|
||||
.writing-modes {
|
||||
text-orientation: before;
|
||||
text-combine-horizontal: after;
|
||||
writing-mode: isolate;
|
||||
display: isolate;
|
||||
display: plaintext;
|
||||
display: mixed;
|
||||
display: upright;
|
||||
display: sideways;
|
||||
display: sideways-right;
|
||||
display: sideways-left;
|
||||
display: use-glyph-orientation;
|
||||
display: horizontal-tb;
|
||||
display: vertical-rl;
|
||||
display: vertical-lr;
|
||||
}
|
||||
|
||||
.html5-elements,
|
||||
template,
|
||||
article,
|
||||
section,
|
||||
nav,
|
||||
aside,
|
||||
hgroup,
|
||||
header,
|
||||
footer,
|
||||
figure,
|
||||
figcaption,
|
||||
main,
|
||||
data,
|
||||
time,
|
||||
mark,
|
||||
ruby,
|
||||
rt,
|
||||
rp,
|
||||
bdi,
|
||||
wbr,
|
||||
embed,
|
||||
video,
|
||||
audio,
|
||||
source,
|
||||
track,
|
||||
canvas,
|
||||
datalist,
|
||||
keygen,
|
||||
output,
|
||||
progress,
|
||||
meter,
|
||||
details,
|
||||
summary,
|
||||
menuitem,
|
||||
dialog {
|
||||
display: auto;
|
||||
}
|
||||
</style>
|
||||
|
||||
<!--[if lt IE 9]><script src="http://hail2u.net/scripts/html5shiv.min.js"></script><![endif]-->
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<h1>vim-css3-syntax</h1>
|
||||
</header>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user