آموزش Less برگرداندن رشته یا scaping
مقدمه:
با سلام خدمت شما کاربر محترم آموزش برنامه نویسی و طراحی وب من علیرضا حاتمی نیا هستم و با بخشی دیگر از آموزش less از وبسایت ilikephp در خدمت شما هستم.
اگر به خاطر داشته باشید در جلسه قبل با آموزش عملگرها در less در خدمت شما بودیم. در این جلسه قصد داریم تا با آموزش برگرداندن رشته در less یا less scaping آشنا شویم.
برگرداندن یک رشته در less یا escaping
توسط escaping در less شما می توانید یک رشته دلخواه را به عنوان یک ویژگی یا مقدار یک متغیر استفاده کنید. شیوه کار نیز به این صورت است که رشته مورد نظر را بین دو کاراکتر "" یا '' نوشته و بعد یک علامت ~ قبل از آن قرار می دهیم.
فرض کیند رشته مورد نظر ما عبارت "this is tutorial of scaping in less" می باشد. پس به شیوه زیر عمل میکنیم.
~"this is tutorial of scaping in less"
یا
~'this is tutorial of scaping in less'
به مثال زیر در فایل mystyle.less اینگونه عمل می کنیم:
توسط دستور زیر فایل mystyle.less را به mystyle.css کامپایل می کنیم.
lessc mystyle.less mystyle.css
اجرای کد بالا فایل mystyle.css را به صورت خودکار می سازد.
mystyle.css
.myElement {
content: ^//* this is tutorial of scaping in less;
}
در مثالی دیگر فرض کنید قصد داریم مقدار خصوصیت color را برای تگ div برابر red قرار دهیم. پس فایل mystyle.less را به شکل زیر می سازیم
mystyle.less
div {
color: ~"red";
}
توسط دستور زیر فایل mystyle.less را به mystyle.css کامپایل می کنیم.
lessc mystyle.less mystyle.css
mystyle.css
div {
color: red;
}
نظرات کاربران