calc() Es ist eine Funktion in CSS, ja, CSS kann auch Funktionen verwenden. Tatsächlich ist die Obergrenze von CSS sehr hoch und es kann viel Logik verarbeiten. Es gibt sogar Programmierer, die sich auf das Schreiben von CSS, aber nicht auf JS spezialisiert haben. Schreiben Sie die Logik im Allgemeinen einfach in js
calc()Ermöglicht die Durchführung grundlegender mathematischer Operationen zwischen CSS-Werten, die berechenbare Entfernungen darstellen. Kann beispielsweise für jeden CSS-Eigenschaftswert verwendet werden, der Länge, Breite, Höhe oder andere Abmessungen erfordert, z. B. width, height, margin,padding，使用方法如下：
.box{
width:100px;
}
.box .item{
width:calc(100% - 10px); //这个运算就表示宽度是父元素宽度的100%减去10像素，也就成了90像素
} Es ist zu beachten, dass bei der Verwendung calc() darauf zu achten ist, dass jeder Teil des mathematischen Ausdrucks in Klammern eingeschlossen ist und beispielsweise durch Leerzeichen getrennt werden musscalc(50% - 10px)
-------------------------------------------------------------------------------------
css常见的函数及作用：
| Funktion | Wirkung |
| calc() | Führen Sie grundlegende mathematische Operationen an Eigenschaftswerten wie Länge, Breite, Höhe usw. durch. |
| rgb() | Legt die Farbe mithilfe der Primärfarbwerte Rot, Grün und Blau fest |
| rgba() | Legen Sie die Farbe mithilfe der Primärfarbwerte Rot, Grün und Blau fest und fügen Sie Transparenz hinzu |
| hsl() | Stellen Sie die Farbe mithilfe von Farbton-, Sättigungs- und Helligkeitswerten ein |
| hsla() | Stellen Sie die Farbe mit Farbton-, Sättigungs- und Helligkeitswerten ein und fügen Sie Transparenz hinzu |
| URL() | Legen Sie das Hintergrundbild oder die URL der Medienressource fest |
| War() | Legen Sie CSS-Variablen fest |
| übersetzen() | Elementposition transformieren |
| drehen() | Konvertieren Sie den Rotationswinkel des Elements |
| Skala() | Elementgröße umrechnen |
| schief() | Konvertieren Sie den Neigungswinkel des Elements |
| Kubikbezier() | Erstellen Sie Bezier-Kurven, die die Animationsgeschwindigkeit und -kurven steuern |
| Klemme() | Beschränken Sie Elementstile auf minimale, empfohlene und maximale Werte |
| Mindest() | Wählen Sie den kleineren Wert zwischen zwei Werten |
| max() | Wählen Sie den größeren Wert zwischen zwei Werten |
| attr() | Rufen Sie den benutzerdefinierten Attributwert des HTML-Elements ab und verwenden Sie ihn in der CSS-Eigenschaft |
| Box Schatten() | Erstellen Sie einen Schlagschatteneffekt für ein Element |
| text-shadow() | Fügen Sie dem Text einen Schatteneffekt hinzu |
| linearer-gradient() | Erstellen Sie einen linearen Verlaufseffekt |
| radial-gradient() | Erstellen Sie einen radialen Verlaufseffekt |
| wiederholen() | Gibt an, wie das Hintergrundbild gekachelt wird |
| runden() | Gibt die abgerundeten Ecken in den vier Richtungen des Kacheleffekts an |
| Raum() | Geben Sie das Intervall für den Kacheleffekt an |
| strecken() | Geben Sie die Streckung des Kacheleffekts an |
| Filter() | Passen Sie die Farbe und den Stil eines Bildes an |
| Übergang() | Erstellen Sie einfache Übergangseffekte |
| Animation() | Erstellen Sie komplexe Animationseffekte |
Hier ist nur eine kurze Liste und Erläuterung der Funktionen. Sie können Baidu verwenden oder die offizielle Website für bestimmte Verwendungszwecke überprüfen. Wenn Sie das Gefühl haben, dass Sie es in Zukunft verwenden könnten, können Sie es abholen. Daran ist nichts auszusetzen.