۱۴
اسفند

جلسه ۰۶ : برگرداندن متن در Less

دسته‌بندی‌ها :

جزئیات
نوع محتواآموزش تصویری

فهرست

مقدمه

با عرض سلام خدمت کاربران سایت پی وی لرن ، و کاربرانی که دوره کامل آموزش LESS را دنبال می کنند. اگر به خاطر داشته باشید در جلسه قبل با آموزش عملگرها در less در خدمت شما بودیم. در این جلسه می آموزید که چطور یک متن را در Less مشخص کنید که بعد از کامپایل شدن، به صورت رشته در آید که به این عمل برگرداندن متن در Less یا escaping در Less می گویند.

برگرداندن متن در Less

شیوه کار escaping در Less به این صورت است که رشته مورد نظر را بین دو کاراکتر “” یا ” نوشته و سپس یک علامت ~ قبل از آن قرار می دهیم.

مثال زیر برگرداندن متن در Less را بعد از کامپایل شدن به صورت رشته نشان میدهد:

مثال :

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

<html>

<head>

<title>Less Escaping</title>

</head>

<body>

<h1>Example using Escaping</h1>

<p>LESS enables customizable, manageable and reusable style sheet for web site.</p>

</body>

</html>

اکنون فایل style.less را بسازید:

مثال :

p {
   color: ~"green";
}

p {

color: ~"green";

}

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

مثال :

lessc style.less style.css

1	lessc style.less style.css

با اجرای دستور بالا، فایل style.css به صورت خودکار، ایجاد می شود:

style.css

مثال :

p {
   color: green;
}

p {

color: green;

}

همان طور که میبینید، هرچیزی که در “این قسمت”~ نوشته شود، بعد از کامپایل شدن فایل Less به صورت یک رشته، چاپ خواهد شد.

خروجی

گام های زیر را انجام دهید تا مشاهده کنید که کدهای بالا چگونه کار می کنند:

کد اچ تی ام ال ابتدای صفحه را با نام escaping.html ذخیره کنید.
سپس فایل اچ تی ام ال را در یک مرورگر با کنید.خروجی زیر برای شما نمایش داده میشود.

کلام آخر

توسط escaping در less شما می توانید یک رشته دلخواه را به عنوان یک ویژگی یا مقدار یک متغیر استفاده کنید.این عمل از از ویژگی های مهم در LESS به شمار می رود،این جلسه نیز به پایان رسید با ما همراه باشید تا در جلسه بعدی،آموزش توابع در LESS را فرا گیریم .

به اشتراک بگذارید

escaping ,برگرداندن رشته ,برگرداندن متن در Less ,کامپایل شدن فایل Less

دیدگاه کاربران

تعداد دیدگاه : 0

پی وی لرن – آموزش برنامه نویسی و طراحی وب سایت

دوره های آموزشی آکادمی پی وی لرن (پروژه محور و ویژه بازار کار)

جلسه ۰۶ : برگرداندن متن در Less

مقدمه

برگرداندن متن در Less

style.css

خروجی

کلام آخر

لیست مطالب دوره

مقدمه

ویژگی های زبان برنامه نویسی LESS

توابع در LESS

کاربرد LESS

مطالب ویژه

دسته های اصلی

برگه ها

بلاگ