ul.ul1
  li Item 1
  li Item 2
  li Item 3
  li Item 4
  li Item 5
ul.ul2
  li Item 1
  li Item 2
  li Item 3
  li Item 4
  li Item 5
ul.ul3
  li Item 1
  li Item 2
  li Item 3
  li Item 4
  li Item 5
View Compiled
// Adding padding to all list item elements
li {
  padding: .5rem;
}

// Styling different list item elements
.ul1 li {
  border: 1px solid salmon;
}

.ul2 li {
  border: 1px solid seagreen;
}

.ul3 li {
  border: 1px solid blueviolet;
}

// Adding margin bottom to all list item elements
.ul1 li {
  margin-bottom: 1rem;
}

// Disabling the margin bottom of the last item element
.ul1 li:last-child {
  margin-bottom: 0;
}

// Adding margin bottom to all list items except the last one
.ul2 li:not(:last-child) {
  margin-bottom: 1rem;
}

// Adding margin top to all list items that have the previous sibling
.ul3 li + li {
  margin-top: 1rem;
}

View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.