VimPlug/vim-css3-syntax
1
0
Fork 0
mirror of https://github.com/hail2u/vim-css3-syntax.git synced 2025-12-08 11:34:45 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Add css-images-4.vim

Browse Source 
See also: http://www.w3.org/TR/2017/WD-css-images-4-20170413/

This commit also moves some properties and functions from
`css3-images.vim`.
This commit is contained in:
Kyo Nagashima
2017-04-22 12:04:57 +09:00
parent 4162325b6c
commit 9f1b8dbb3f
5 changed files with 23 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
test/test.css
View File

@@ -363,19 +363,24 @@
grid-gap: auto;
}
.images {
.images-3 {
object-fit: contain;
object-position: cover;
image-resolution: snap;
image-orientation: scale-down;
image-orientation: snap;
display: 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);
}
.images-4 {
image-resolution: image("sprite.svg#xywh=40,0,20,20");
display: element(#test);
display: conic-gradient(at 25% 30%, white, black 60%);
}
.inline-3 {
dominant-baseline: mathematical;
alignment-baseline: ideographic;

12
test/test.html
View File

@@ -404,10 +404,9 @@
.images {
object-fit: contain;
object-position: cover;
image-resolution: snap;
image-orientation: scale-down;
image-orientation: snap;
display: 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);
@@ -415,6 +414,13 @@
}
</style>
<style>
.images-4 {
image-resolution: image("sprite.svg#xywh=40,0,20,20");
display: element(#test);
display: conic-gradient(at 25% 30%, white, black 60%);
}
</style>
<style>
.inline-3 {
dominant-baseline: mathematical;
alignment-baseline: ideographic;