適用人群:對web端、移動端設計規範不甚熟悉的初學者
解決的問題:表單是左對齊還是右對齊,豎排還是橫排?
一、表單標籤
表單樣式(頂對齊標籤)
3.、4種表單標籤樣式
(1)頂對齊
(2)左對齊
(3)右對齊
(4)輸入框內標籤
二、四種表單標籤樣式介紹
1.頂對齊標籤(如上圖)
缺點:占用大量的垂直空間
使用場景:適用於標籤過長,或者組合式標籤(如下圖)
混合標籤
1.右對齊標籤
右對齊標籤
優點:標籤與輸入框相鄰,因此也可快速填寫,可以節省垂直空間
缺點:可以試想一下,如果第乙個標籤有5-6個字元,第二個標籤有2個字元,第三個標籤有3個字元,組合起來可能不是很靈活,標籤長度和輸入框組合彈性較小
3.左對齊標籤
左對齊標籤
優點:和右對齊一樣節省垂直空間
(4)輸入框內標籤
輸入框內標籤
優點:將標籤放入輸入框內,可大量節省垂直、水平空間
缺點:填寫內容時,輸入框內的情景提示會消失,使用者可能忘記要填寫的內容。如果表單內容較長,使用者填完後不方便檢驗
適用場景:只有單一問題(如搜尋框)、只有1-3個輸入框時、使用者十分熟悉的問題時
小結
不論標籤是採用頂對,左對齊,右對齊,亦或是輸入框內提示,都沒有絕對的正確錯誤之分,最重要的是符合使用者場景
其他
筆者曾在校招面試中遇到此類的問題,面試官結合公司的業務場景將四種標籤對齊方式都列出來,問這幾種方式哪個好。
這些都是表單的設計規範問題,如果你是一位新入門的互動設計師,建議一定要看以下書籍和**
《web表單設計—點石成金的藝術》*(b端同學必讀)
ant design —— 螞蟻金服 網頁規範 官網:
material design —— google(谷歌)官網:introduction - material design,中文翻譯:
五 解決Spring配置檔案中標籤不提示
本文主要解決的是當不能上網的環境下出現標籤沒有提示的問題,比如博主公司就是在內網開發,不能訪問網際網路.這裡以beans模組的schdma為例子 xmlns xmlns xsi xsi schemalocation spring beans.xsd id user class cn.com.yves...
jquery validate 驗證不提示問題
前段 是 js function checkinput txt sfamilyno ddl slbcode chk isenjoysubsidy ddl sjtlbcodeqh return result.form jquery.validator.addmethod requiredsubsidy...
linux cp拷貝覆蓋不提示
linux cp拷貝覆蓋不提示 cp f 如果檔案存在則不提示,直接覆蓋。但是有時加了 f,怎麼還會有提示呢?原因是一些伺服器會預設增加別名alias cp cp i 當你執行cp時,其實執行的是cp i。root localhost alias alias cp cp i alias egrep ...