LESS - Ad Alanları ve Erişimciler

Açıklama

Ad alanları, karışımları ortak bir ad altında gruplamak için kullanılır. Ad alanlarını kullanarak ad çatışmasını önleyebilir ve bir karışım grubunu dışarıdan kapsülleyebilirsiniz.

Misal

Aşağıdaki örnek, LESS dosyasında ad alanlarının ve erişimcilerin kullanımını gösterir -

<html>
   <head>
      <title>Less Namespaces and Accessors</title>
      <link rel = "stylesheet" type = "text/css" href = "style.css" />
   </head>
   
   <body>
      <h1>Example using Namespaces and Accessors</h1>
      <p class = "myclass">LESS enables customizable, 
      manageable and reusable style sheet for web site.</p>
   </body>
</html>

Şimdi style.less dosyasını oluşturun.

style.less

.class1 {
   .class2 {
      .val(@param) {
         font-size: @param;
         color:green;
      }
   }
}

.myclass {
   .class1 > .class2 > .val(20px);
}

Aşağıdaki komutu kullanarak style.less dosyasını style.css olarak derleyebilirsiniz -

lessc style.less style.css

Yukarıdaki komutu yürütün; style.css dosyasını aşağıdaki kodla otomatik olarak oluşturacaktır -

style.css

.myclass {
   font-size: 20px;
   color: green;
}

Çıktı

Yukarıdaki kodun nasıl çalıştığını görmek için şu adımları izleyin -

Yukarıdaki html kodunu şuraya kaydedin: namespaces_accessors.html dosya.
Bu HTML dosyasını bir tarayıcıda açın, aşağıdaki çıktı görüntülenecektir.