Skip to content

CSS: stacking

.--stack-topmost — ยูทิลิตี้ความลึกของ z-index — .--stack-<level> (deepest, below, above, topmost) — ใช้งานได้แบบเปล่า ๆ หรือเชนกับคอมโพเนนต์ใดก็ได้ ทำให้เลเยอร์ซ้อนกันอย่างคาดเดาได้ แทนการใช้ตัวเลขที่ปรับด้วยมือ

Source: index.ts

การใช้งาน

css
@import "@pantoken/components/utilities.css";

ตัวอย่าง

html
<div class="--stack-topmost">Always on top.</div>

ตัวปรับแต่ง

ตัวปรับแต่งคำอธิบาย
.--stack-aboveเหนือการจัดวางเริ่มต้น
.--stack-belowใต้การจัดวางเริ่มต้น
.--stack-deepestระดับการซ้อนต่ำสุด
.--stack-topmostระดับการซ้อนสูงสุด (เช่น โอเวอร์เลย์และเมนู)

โทเค็นที่ใช้

Tokenชนิดค่า
--instui-component-view-stacking-above<integer>1
--instui-component-view-stacking-below<integer>-1
--instui-component-view-stacking-deepest<integer>-9999
--instui-component-view-stacking-topmost<integer>9999