Label 輸入框旁邊

Question

我的同事想出了這個主意。 Webflow 默認在輸入字段頂部制作 forms 和 label。 select 沒有簡單的選項可以將 label 放在同一行的輸入字段旁邊。 我的同事所做的是在輸入字段的框 model 的頂部使用負邊距，並添加填充，輸入字段的左邊距。 這將使輸入字段與 label 在同一行並在其旁邊對齊。

Answer 1

一種稍微清潔的方法是；

• 給label分配一個class，例如Label
• 給你的 label 一個固定的寬度
• 將 label 和字段包裹在一個 DIV 中，為其分配一個 class，例如Field Frame
• 將該 DIV 的布局設置為 flex horizontal。

這使您對標簽字段布局有更多的可預測性，這在您設計更窄的斷點時變得很重要。

很有可能在移動縱向斷點處，您希望 label 出現在輸入字段上方，而 flex 允許您在您選擇的任何斷點處輕松將該樣式更改為垂直。

當然，另一種選擇是完全放棄標簽，而是使用占位符設置。