iT邦幫忙

2022 iThome 鐵人賽

DAY 14
0
Modern Web

不斷片(篇)挑戰系列 第 14

<DAY 14> form controls (二) [bootstrap 5]

  • 分享至 

  • xImage
  •  

各位大佬們好,今天是鐵人賽的第14天,今天的題目是bootstrap 5 如何進階使用form controls的功用,不容易呀!寫了14天的文章了,一下子比賽就過了快一半了:)

禁用

屬性disabled
<input class="form-control" placeholder="屬性disabled,no readonly input" aria-label="Disabled input example" disabled>
<input class="form-control" value="屬性disabled,readonly input" aria-label="Disabled input example" disabled readonly>

兩個在input加入布林屬性disabled其外觀呈現灰色,並移除pointer事件。

僅能閱讀

readonly
<input class="form-control" type="text" value="僅能閱讀" aria-label="readonly input example" readonly>

input加入布林屬性readonly防止修改input。僅能閱讀的input顯示較淡,但保留標準游標。

很高興各位大佬觀看今天的鐵人賽文章,今天的文章結束囉!讓我們滿心歡喜迎接明天的到來。


上一篇
<DAY 13> 從bootstrap 5 來使用 form controls(一)
下一篇
<DAY 15> form controls (三) [bootstrap 5]
系列文
不斷片(篇)挑戰30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言