亚洲av无码乱码国产一区二区,午夜理论片yy44880影院,午夜久久久久久禁播电影,熟睡人妻被讨厌的公侵犯

21
2024/12

新手科普!UI組件中的產(chǎn)品卡片設計(二)卡片樣式

發(fā)布時間:2024-12-21 17:11:14
發(fā)布者:guokai
瀏覽量:
0

產(chǎn)品卡片的設計主要有三種樣式,分別為全包裹樣式、半包裹樣式和開放(完全不包裹)樣式。

首先是全包裹:有明確的卡片背景,一個產(chǎn)品為單獨的一個模塊,將圖片和文本全部包括在內(nèi)部,每個產(chǎn)品之間互不影響,互相獨立,這種樣式目前主要在使用的是阿里巴巴,總體來說,比較不常見。

全包:有明確的卡片背景,將圖片和文本全部包括在內(nèi)部,比較不常見。

其次是半包裹的設計:圖片部分會占滿卡片的上半部分,而文本的位置跟全包一樣,屬于比較常見的一種。需要注意的一點是如果圖片跟全包一樣需要做圓角,圖片下方的兩個角是不需要給圓角的??梢?a target="_blank">參考網(wǎng)頁版的京東,產(chǎn)品選中的狀態(tài)。

半包:圖片部分會撐滿卡片的邊界,而文本依然在卡片內(nèi)部,

最后是開放(完全不包裹)樣的卡片設計:這種設計圖片沒有明確的背景,圖+文本自然組成一個卡片區(qū)域,在設計上通常會讓文本兩側(cè)較之圖片的寬度稍微向中間縮進一些距離,讓文本區(qū)域的寬度小于圖片寬度,在讓親密性表現(xiàn)得更舒適。一般情況是兩側(cè)同時縮進,也可以將左側(cè)與圖片對齊,只縮進右側(cè)。可以參考網(wǎng)頁版淘寶的產(chǎn)品卡片設計樣式,就是經(jīng)典的開放式卡片設計。

開放式:沒有明確的卡片背景,圖+文本自成卡片區(qū)域

關鍵詞:
返回列表