น้อย - หลบหนี

คำอธิบาย

สร้างตัวเลือกแบบไดนามิกและใช้คุณสมบัติหรือค่าตัวแปรเป็นสตริงที่กำหนดเอง

ตัวอย่าง

ตัวอย่างต่อไปนี้แสดงให้เห็นถึงการใช้ Escape ในไฟล์ 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>

ตอนนี้สร้างไฟล์style.less

style.less

p {
   color: ~"green";
}

คุณสามารถคอมไพล์ไฟล์style.lessเป็นstyle.cssโดยใช้คำสั่งต่อไปนี้ -

lessc style.less style.css

ดำเนินการคำสั่งด้านบนมันจะสร้างไฟล์ style.css โดยอัตโนมัติด้วยรหัสต่อไปนี้ -

style.css

p {
   color: green;
}

ทุกสิ่งที่เขียนอยู่ภายใน~ "some_text"จะแสดงเป็นsome_textหลังจากรวบรวมโค้ด LESS เป็นโค้ด CSS

เอาต์พุต

ตอนนี้ให้เราทำตามขั้นตอนต่อไปนี้เพื่อดูว่าโค้ดด้านบนทำงานอย่างไร -

  • บันทึกรหัส html ด้านบนในไฟล์ escaping.html ไฟล์.

  • เปิดไฟล์ HTML นี้ในเบราว์เซอร์ผลลัพธ์ต่อไปนี้จะปรากฏขึ้น