加入邊框
1. 前言
不帶邊框和帶邊框的九宮格實現(xiàn)起來有著較大的不同,這是為什么呢?
比如先給大家看一個無邊框的九宮格:

通常來說沒有邊框的九宮格都是有一個間距,比如說朋友圈的那種:

如果給它加個邊框就會變成這樣:

看起來還是沒毛病對吧?那接下來我們把它們九個合并到一起去再看看:

2. 詳細(xì)對比
有沒有感覺好像哪里不太對?如果感覺不太明顯的話我們將灰色背景去掉再來瞅一眼:

是不是感覺格子里面的線條好像更粗呢?為什么會造成這種現(xiàn)象,其實是因為這樣:

相鄰的兩個邊框貼在了一起就會變成兩倍粗的一個大邊框。
3. 小結(jié)
之前我們都是用外邊距等屬性來讓九宮格之間有間距的,但還是有一些場景是不需要間距而需要邊框的,比如說微信的這個界面:

或者這種:

可以看到他們的各個邊框都很均勻,沒有出現(xiàn)哪粗哪細(xì)的情況,接下來我們就來講一下如何才能做到這一點(diǎn)。
手撕紅黑樹 ·
2025 imooc.com All Rights Reserved |