使用CSS3如何编写田字格列表样式

本篇内容主要讲解"使用CSS3如何编写田字格列表样式"，感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷，实用性强。下面就让小编来带大家学习"使用CSS3如何编写田字格列表样式"吧!

CSS

HTML

    
香港
    
澳门
    
台湾
    
曼谷
    
新加坡
    
首尔
    
东京
    
济州岛
    
芭堤雅

当显示4列时，给:after添加样式，注意需要更改li的width、.mp-list:before的位置。

.mp-list:after {    content: '';    position: absolute;    width: 10%;    left: 75%;    height: 100%;    border-left: .02rem solid #ddd;    border-right: 0;}

到此，相信大家对"使用CSS3如何编写田字格列表样式"有了更深的了解，不妨来实际操作一番吧！这里是网站，更多相关内容可以进入相关频道进行查询，关注我们，继续学习！