ตัวแปรใน LESS

ภาษา LESS อนุญาตให้ใช้ ตัวแปร ตัวแปรเป็นเหมือนคอนเทนเนอร์ ที่สามารถเก็บข้อมูลบางอย่างไว้และ นำมาใช้ในตำแหน่งที่ต้องการในโค้ด

เพื่อสร้างตัวแปร คุณต้องคิดชื่อ ของมันและใส่เครื่องหมาย @ ไว้ข้างหน้า จากนั้นหลังชื่อตัวแปรให้ใส่เครื่องหมายโคลอน และระบุค่าของตัวแปรนั้น มาลอง สร้างตัวแปรชื่อ var เป็นตัวอย่าง:

@var: 20px;

ตอนนี้ลองใช้ตัวแปรนี้ เป็นค่าของพร็อพเพอร์ตี้:

p {
	font-size: @var;
}

ผลลัพธ์หลังการคอมไพล์เป็น CSS แทนที่ ตัวแปรของเราจะถูกแทนที่ด้วยค่าของมัน:

p {
	font-size: 20px;
}

บอกหน่อยว่าผลลัพธ์ของการคอมไพล์ โค้ดต่อไปนี้จะเป็นอย่างไร:

@color: #000;

p {
	color: @color;
}