Was ist CleverCSS?

CleverCSS ist eine kleine Auszeichnungssprache für CSS, die von Python inspiriert ist und eine einfache und klare Struktur verwendet. Sie kann verwendet werden, um ein Stylesheet auf saubere und strukturierte Weise zu erstellen. Der offensichtlichste Unterschied zwischen CleverCSS und CSS ist die Syntax basiert auf Einrückung und ist nicht eintönig.

CleverCSS ist eine kleine, von Python inspirierte Auszeichnungssprache für CSS, mit der sich ein Stylesheet auf saubere und strukturierte Weise erstellen lässt. In vielerlei Hinsicht ist es sauberer und leistungsfähiger als CSS2.

Der offensichtlichste Unterschied zwischen CleverCSS und CSS ist die Syntax: Sie basiert auf Einrückungen und ist nicht eintönig. Obwohl dies offensichtlich gegen die Regeln von Python verstößt, ist es dennoch eine gute Idee für die Organisation von Stilen.

Ein kleines Beispiel:

ul#comments, ol#comments:
  margin: 0
  padding: 0

  li:
    padding: 0.4em
    margin: 0.8em 0 0.8em

    h3:
      font-size: 1.2em
    p:
      padding: 0.3em
    p.meta:
      text-align: right
      color: #ddd

Sie können jedoch auch Attribute verwenden:

#main p:
   font->
    family: Verdana, sans-serif
    size: 1.1em
    style: italic

Konstanten definieren:

background_color = #ccc
 
#main:
  background-color: $background_color

Implizite Verkettung:

padding: $foo + 2 + 3 $foo - 2
 
// returns: padding: 15 8; if $foo is 10

Berechnung:

// calculations with numbers / values
42px + 2                    -> 44px
10px * 2                    -> 20px
1cm + 1mm                   -> 11mm
(1 + 2) * 3                 -> 9
 
// string concatenation
foo + bar                   -> foobar
"blub blah" + "baz"         -> 'blub blahbaz'
 
// You can also calculate with numbers:
#fff - #ccc                 -> #333333
cornflowerblue - coral      -> #00169d
 
// You can also add or subtract a number from it and it will do so for all three channels (red, green, blue):
crimson - 20                -> #c80028

Für weitere Programmierkenntnisse , besuchen Sie bitte: Programmierung lehren! !

Das obige ist der detaillierte Inhalt vonWas ist CleverCSS?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!