<style type="text/css">
.mystyle1 {
border-style: dotted;
border-color: gray;
width: 20em;
padding: .5em;
margin: .5em;
border-width: 3px;
text-align: center;
font-weight: bold }

.mystyle2 {
border-style: dashed;
border-color: gray;
width: 20em;
padding: .5em;
margin: .5em;
border-width: 3px;
text-align: center;
font-weight: bold }

.mystyle3 { border-style: solid;
border-color: gray;
width: 20em;
padding: .5em;
margin: .5em;
border-width: 3px;
text-align: center;
font-weight: bold }

.mystyle4 {
border-style: double;
border-color: gray;
width: 20em;
padding: .5em;
margin: .5em;
border-width: 3px;
text-align: center;
font-weight: bold }

.mystyle5{
border-style: groove;
border-color: gray;
width: 20em;
padding: .5em;
margin: .5em;
border-width: 3px;
text-align: center;
font-weight: bold }

.mystyle6{
border-style: ridge;
border-color: gray;
width: 20em;
padding: .5em;
margin: .5em;
border-width: 3px;
text-align: center;
font-weight: bold }

.mystyle7 {
border-style: inset;
border-color: gray;
width: 20em;
padding: .5em;
margin: .5em;
border-width: 3px;
text-align: center;
font-weight: bold }

.mystyle8 {
border-style: outset;
border-color: gray;
width: 20em;
padding: .5em;
margin: .5em;
border-width: 3px;
text-align: center;
font-weight: bold }
</style>
.....
<div class="mystyle1">Dotted border style around this text</div>
<div class="mystyle2">Dashed border style around this text</div>
<div class="mystyle3">Solid border style around this text</div>
<div class="mystyle4">Double border style around this text</div>
<div class="mystyle5">Groove border style around this text</div>
<div class="mystyle6">Ridge border style around this text</div>
<div class="mystyle7">Inset border style around this text</div>
<div class="mystyle8">Outset border style around this text</div>

....