IOS 不能正常顯示 CheckBox

html css checkbox

nick12345 2021-11-23 11:21:48 ‧ 1916 瀏覽

分享至

<input type="checkbox" class="checkBox" name="checkBox" value="checkBox">

在android的chrome看是正常的，但在iphone的chrome和safari看，會變到超小，請問是不是要做什麼諼定才能正常觀看?

窮嘶發發發 iT邦高手 1 級 ‧ 2021-11-23 11:37:31 檢舉

建議用 BOOTSTRAP
參考文件 https://getbootstrap.com/docs/5.0/forms/overview/

nick12345 iT邦新手 4 級 ‧ 2021-11-23 12:09:30 檢舉

有不用Bootstrap的方法嗎?

窮嘶發發發 iT邦高手 1 級 ‧ 2021-11-23 14:30:22 檢舉

IPHONE 會自動縮小頁面到可視範圍，基本上就這個原因，你可以不用 BOOTSTRAP，然後自己設計符合 RWD 規範的CSS 語法，我也不會說不行
但你光遇到一個小問題就上來問，你也可以先用 BOOTSTRAP，再去參考別人怎麼寫，自己消化變成自己的東西，這也是一種方法，我們只能給你建議，因為我們本來大多這麼做，當然有很多大神靠自己手刻到很完美的程度，但沒有這個能力參考別人的語法才能快速學習，給樓主參考囉

登入發表討論

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

4 個回答

海綿寶寶

iT邦大神 1 級 ‧ 2021-11-23 12:15:10

參考W3S的寫法

如果
你自己有設定 css 的話
就要把相關的部份貼出來
css 高手才能替你解決

回應 6
分享
檢舉

看更多先前的回應...收起先前的回應...

nick12345 iT邦新手 4 級 ‧ 2021-11-23 12:24:33 檢舉

<input type="checkbox" class="checkBox" name="checkBox" value="checkBox">

沒有設置css....ios要有特別的css嗎?

海綿寶寶 iT邦大神 1 級 ‧ 2021-11-23 12:31:56 檢舉

W3S 的範例(沒設 css)：正常
你的 code 寫了 class="checkBox"
我以為你自己有設什麼 css

nick12345 iT邦新手 4 級 ‧ 2021-11-23 12:36:25 檢舉

不懂為什麼IPHONE看就會超小，android就正常，請問有解決方法嗎?

Mao iT邦研究生 5 級 ‧ 2021-11-23 13:18:45 檢舉

解決辦法就是設 CSS

nick12345 iT邦新手 4 級 ‧ 2021-11-23 14:09:06 檢舉

有設置方法是FOR IPHONE?

海綿寶寶 iT邦大神 1 級 ‧ 2021-11-23 15:10:34 檢舉

先用iPhone看一下W3S的範例
如果仍然是「超小」
再來設 css

登入發表回應

㊣浩瀚星空㊣

iT邦大神 1 級 ‧ 2021-11-23 14:50:03

上面兩個大大們都已經跟你說的很清楚了。

你不想設定或是規劃CSS。
那就是會吃裝置或瀏覽器的預設CSS表現。

所以你不想要用預設的表現，就是只能去改掉它而已。

窮嘶發發發大說的方式是最簡單的。
因為BOOTSTRAP會幫你做CSS調整。
你也不太需要特別去設定什麼。(雖然還是要設定)

海綿寶寶大則是給你最基本原始的宣告方式。

這兩種方法都已經是最直接原始。如果你還要其它「FOR IPHONE」
那.......

回應
分享
檢舉

登入發表回應

純真的人

iT邦大師 1 級 ‧ 2021-11-24 09:53:18

大概你沒宣告這個吧

<meta name="viewport" content="width=device-width" />

沒宣告的話~手機畫面都會以電腦畫面為基準

回應
分享
檢舉

登入發表回應

電腦達人

iT邦新手 2 級 ‧ 2021-11-29 08:29:30

這就是CSS問題
不是用大大說的Boostrap去全權控制
就是自己寫一段針對iphone的css來去控制
至於FOR IPHONE的
我不敢說有沒有除了Boostrap之外有沒有類似的東西
但就算有也請去細讀一下document類的東西
讀完後不懂得歡迎討論
不是一直問有沒有{FOR IPHONE}就會憑空出現