acos()
Baseline 2023Newly available
Since March 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.
Die acos()
CSS Funktion ist eine trigonometrische Funktion, die den Arkuskosinus einer Zahl zwischen -1
und 1
zurückgibt. Die Funktion enthält eine einzige Berechnung, die die Anzahl der Bogenmaß-Einheiten zurückgibt, die ein <angle>
zwischen 0deg
und 180deg
darstellt.
Syntax
/* Single <number> values */
transform: rotate(acos(-0.2));
transform: rotate(acos(2 * 0.125));
/* Other values */
transform: rotate(acos(pi / 5));
transform: rotate(acos(e / 3));
Parameter
Rückgabewert
Der Arkuskosinus einer number
wird immer ein <angle>
zwischen 0deg
und 180deg
zurückgeben.
- Wenn
number
kleiner als-1
oder größer als1
ist, ist das ErgebnisNaN
. - Wenn
number
genau1
ist, ist das Ergebnis0
.
Formale Syntax
Beispiele
Elemente rotieren
Die acos()
Funktion kann verwendet werden, um Elemente zu rotieren
, da sie ein <angle>
zurückgibt.
HTML
<div class="box box-1"></div>
<div class="box box-2"></div>
<div class="box box-3"></div>
<div class="box box-4"></div>
<div class="box box-5"></div>
CSS
div.box {
width: 100px;
height: 100px;
background: linear-gradient(orange, red);
}
div.box-1 {
transform: rotate(acos(1));
}
div.box-2 {
transform: rotate(acos(0.5));
}
div.box-3 {
transform: rotate(acos(0));
}
div.box-4 {
transform: rotate(acos(-0.5));
}
div.box-5 {
transform: rotate(acos(-1));
}
Ergebnis
Spezifikationen
Specification |
---|
CSS Values and Units Module Level 4 # trig-funcs |
Browser-Kompatibilität
Report problems with this compatibility data on GitHubdesktop | mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
acos() |
Legend
Tip: you can click/tap on a cell for more information.
- Full support
- Full support
- No support
- No support