Less.js: Die Verwendung von CSS3 background-size innerhalb der Abkürzungseigenschaft `background` führt zu einem Syntaxfehler
Die neue background-size Eigenschaft von CSS3 kann in die background Kurzschrift-Deklaration eingefügt werden, indem man sie wie folgt von der background-position Spezifikation durch einen Schrägstrich trennt:
div {
background: url('/path/to/image.png') left center / contain no-repeat;
}
Das Ergebnis ist jedoch ein Syntaxfehler, bei dem der Parser offensichtlich an dem / contain Teil verschluckt – das Entfernen lässt den Fehler ebenfalls verschwinden.
Natürlich ist es möglich, dieses Problem zu umgehen, indem Sie den gesamten Wert der Eigenschaft background mit ~"…" , aber es wäre wirklich schön, die Standardsyntax ohne Einschränkungen verwenden zu können.
yggi49
Alle 7 Kommentare
Sieht aus wie ein Unterfall von PR #915, aber dazu gab es seit einiger Zeit keine Neuigkeiten ...
plumbojumbo
am 16. Jan. 2013
ja, genau deshalb wird es in 1.4.0 sein. Ich übernehme #915, wenn @dmcass es nicht fertig macht.
lukeapage
am 16. Jan. 2013
Auf Master behoben
lukeapage
am 2. Feb. 2013
Ich scheine dieses Problem in Lesc 2.1.1 zu haben.
/* less */
#header {
height: 50px;
width: 100%;
padding: 0 10px;
font-size: 20px;
background: url("/img/nav-back.jpg") 0 0/100%;
position: fixed;
}
/* compiled css */
#header {
height: 50px;
width: 100%;
padding: 0 10px;
font-size: 20px;
background: url("/img/nav-back.jpg") 0 0;
position: fixed;
}
Läuft unter Linux Mint 17 Qiana mit lessc 2.1.1.
yang-jandro
am 7. Jan. 2015
@gpv-dev
Ihr Ergebnis wird erwartet, wenn Sie ohne Option --strict-math=on kompilieren. Inzwischen müssen Sie für solche Anweisungen (mit einer oder zwei Ausnahmen, zB font Eigenschaft) entweder --strict-math=on oder ein Escapezeichen für / , zB: ~"0/100%" .
seven-phases-max
am 7. Jan. 2015
@sieben-phasen-max
Danke für die schnelle Antwort. Dein Vorschlag war genau das, was ich brauchte.
yang-jandro
am 8. Jan. 2015
Danke @seven-phases-max, es funktioniert:
url(/assets/img/logos/foo.png) 0 0 / ~"167px auto" no-repeat;
url(/assets/img/logos/foo.png) 0 0 / contain no-repeat;
juukie
am 30. Nov. 2017
Verwandte Themen
heavyk
·
3Kommentare
matthew-dean
·
6Kommentare
pknepper
·
3Kommentare
MarkSG93
·
4Kommentare
bassjobsen
·
6Kommentare
Hilfreichster Kommentar
@gpv-dev
Ihr Ergebnis wird erwartet, wenn Sie ohne Option
--strict-math=onkompilieren. Inzwischen müssen Sie für solche Anweisungen (mit einer oder zwei Ausnahmen, zBfontEigenschaft) entweder--strict-math=onoder ein Escapezeichen für/, zB:~"0/100%".