html – Exactly how to reset/ override CSS design of LI

This is my very first effort trying to work with css. A web page specify li to reveal as grid table:

 li {
clear: both;
list-style-type: none;
extra padding: 5px 5px;
border-style: strong;
border-color: grey;
border-width: 1px 1px 0 1px;
}

li: last-child {
border-width: 1px 1px 1px 1px;
}

I attempted to make use of typical << li>> as the typical listing in the very same web page. What’s the method to do that?

As my very own effort/ research, I have actually attempted to

• alter the above to li.tbl, li.tbl: last-child, or li: last-child. tbl, however the last li will certainly miss out on the lower line, which is past my understanding.
• or modification my typical listing by reset them utilizing all: first, however the design is erroneous– no factor and also all in one line.

I’m asking if I can specify a design to bypass such default setup.