<p class="solid">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Quia, rerum.</p>

<p class="dotted">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Quia, rerum.</p>

<p class="dashed">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Quia, rerum.</p>

<p class="double">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Quia, rerum.</p>

<p class="groove">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Quia, rerum.</p>

<p class="ridge">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Quia, rerum.</p>

<p class="inset">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Quia, rerum.</p>

<p class="outset">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Quia, rerum.</p>

<p class="none">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Quia, rerum.</p>

<p class="hidden">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Quia, rerum.</p>
.solid {
    border-style: solid;
}

.dotted {
    border-style: dotted;
}

.dashed {
    border-style: dashed;
}

.double {
    border-style: double;
}

.groove {
    border-style: groove;
}

.ridge {
    border-style: ridge;
}

.inset {
    border-style: inset;
}

.outset {
    border-style: outset;
}

.none {
    border-style: none;
}

.hidden {
    border-style: hiden;
}
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.