سلام . امیدوارم تا این لحظه از آموزش 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; } }
