آموزش less قواعد تودرتو نویسی دایرکتیوها

 

سلام . امیدوارم تا این لحظه از آموزش less استفاده کرده باشید. 

مقدمه

در آموزش قبلی درباره قواعد تو در تو نویسی در less نکاتی را متذکرشدیم. در این آموزش قصد داریم در مورد تودرتو نویسی دایرکتیوها صحبت کنیم. 

قواعد تود در تو نویسی دایرکتیوها: 

دایرکتیوهای CSS در Less قابل تودرتو نویسی هستند. منظور از دایرکتیوها همان دستوراتی مانند @media، @font-face، @keyframe و ... می باشند. فرض کنید برای کلاسی به نام myStyle دایرکتیو media را جهت تغییر رنگ متن در سایز های مختلف مرورگر می نویسیم.

 .mystyle {
   @media screen {
      color: red;
      @media (min-width: 1024px) {
         color: pink;
      }
   }
   @media text {
      color: green;
   }
} 

طیق روال قبلی فایل style.less را با دستور زیر به فایل style.css کامپایل می کنیم
 

 @media screen {
   .mystyle {
      color: red;
   }
}
@media screen and (min-width: 1024px) {
   .myclass {
      color: pink;
   }
}
@media text {
   .myclass {
      color: green;
   }
}

 

برای درج نظر و یا طرح سوالات خود لطفا در سایت ثبت نام کنید و یا وارد سایت شوید

نظرات کاربران

برای این مطلب تاکنون نظری ارسال نشده است. شما اولین نفر باشید