角标的处理细节(overflow:hidden切割圆角不干净).

如图所示, 由于角标的资源文件右上角有圆角.

所以在展示时, 底下的图会显出来几个像素.

下面的图为了方便看仔细, 有所放大.

 

于是我首先想到给给这个海报外层的div增加一个border-radius.

结果发现, 角上的底色变少了, 但是还有少量底色. 

这会是什么原因呢?

我猜测overflow:hidden在切割圆角时不干净.

验证一下, 把圆角改大, border-radius:10px;

果然, 圆角的外围是干净的, 只有贴着边线的圆弧不干净.

怎么办呢?

我想到一个办法, 把角标往上提一层, 不让角标被overflow:hidden切割到.

发现还是不干净, 我猜测这个切割不干净是往外突的, 

试试把圆角扩大一个像素. border-radius: 3px;

好了, 完美解决.