範例
明暗色系
遵循使用者設定
遵循使用者設定
亮色
暗色
縮放
標準
放大
標準
縮小
<label class="ts-switch">
<input type="checkbox" checked />
斷路保護措施
</label>
狀態
使指撥開關呈現無法互動、點擊的模樣。若你希望真正地停用開關行為,請在該指撥開關增加 disabled
標籤以符合 HTML 規範。
<label class="ts-switch is-disabled">
<input type="checkbox" />
進階模式
</label>
外觀
指撥開關如果沒有任何標籤文字,可以將其指定為單獨的開關,藉此來移除多餘的間距。
<label class="ts-switch is-solo">
<input type="checkbox" />
</label>
更改指撥開關的大小。
<label class="ts-switch is-small">
<input type="checkbox" checked />
小型開關
</label>
<label class="ts-switch">
<input type="checkbox" checked />
預設開關
</label>
<label class="ts-switch is-large">
<input type="checkbox" checked />
大型開關
</label>
在尋找相似的元件嗎?