[分享]css3怎么把ul分成2块

CSS3在前端开发中扮演着重要的角色，可以实现各种炫酷的页面效果。本文将讲解如何使用CSS3将ul分成两块。

 ul {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
  }
  
  li {
    width: 48%;
    margin-bottom: 1rem;
    list-style: none;
    background-color: #f8f8f8;
    padding: 1rem;
  } 

要将ul分成两块，首先需要将其设置为flex容器，并使用justify-content属性设置成space-between，使得li元素分别位于容器的两端。同时要设置flex-wrap为wrap，保证多余的li元素能够被自动调整到下一行。

接着需要设置li元素的宽度和margin，使得两个li元素之间有足够的间隔。同时要将list-style设置为none，去掉默认的标志符号。这里还为li元素添加了一个背景色和内边距，使得它们更美观。

以上就是使用CSS3将ul分成两块的简单教程，希望能对前端开发初学者有所帮助。