<div style="
border-style:solid;/*枠線のスタイル*/
border-color:#aaaaff;/*枠線の色*/
border-width:1px;/*枠線の太さ*/
width:300px;/*枠線の横の長さ*/
height:50px;/*枠線の縦の長さ*/
padding:1px;/*枠の中の文字（画像）と線との余白*/
text-align:left;">
サンプル
</div>

<div style="
border-style:double;/*枠線のスタイル*/
border-color:#aaaaff;/*枠線の色*/
border-width:4px;/*枠線の太さ*/
width:300px;/*枠線の横の長さ*/
height:50px;/*枠線の縦の長さ*/
padding:1px;/*枠の中の文字（画像）と線との余白*/
text-align:left;">
サンプル
</div>

<div style="
border-style:dotted;/*枠線のスタイル*/
border-color:#aaaaff;/*枠線の色*/
border-width:2px;/*枠線の太さ*/
width:300px;/*枠線の横の長さ*/
height:50px;/*枠線の縦の長さ*/
padding:1px;/*枠の中の文字（画像）と線との余白*/
text-align:left;">
サンプル
</div>

<div style="
border-style:dashed;/*枠線のスタイル*/
border-color:#aaaaff;/*枠線の色*/
border-width:2px;/*枠線の太さ*/
width:300px;/*枠線の横の長さ*/
height:50px;/*枠線の縦の長さ*/
padding:1px;/*枠の中の文字（画像）と線との余白*/
text-align:left;">
サンプル
</div>

<div style="
border-style:groove;/*枠線のスタイル*/
border-color:#aaaaff;/*枠線の色*/
border-width:3px;/*枠線の太さ*/
width:300px;/*枠線の横の長さ*/
height:50px;/*枠線の縦の長さ*/
padding:1px;/*枠の中の文字（画像）と線との余白*/
text-align:left;">
サンプル
</div>

<div style="
border-style:ridge;/*枠線のスタイル*/
border-color:#aaaaff;/*枠線の色*/
border-width:2px;/*枠線の太さ*/
width:300px;/*枠線の横の長さ*/
height:50px;/*枠線の縦の長さ*/
padding:1px;/*枠の中の文字（画像）と線との余白*/
text-align:left;">
サンプル
</div>

<div style="
border-style:inset;/*枠線のスタイル*/
border-color:#aaaaff;/*枠線の色*/
border-width:2px;/*枠線の太さ*/
width:300px;/*枠線の横の長さ*/
height:50px;/*枠線の縦の長さ*/
padding:1px;/*枠の中の文字（画像）と線との余白*/
text-align:left;">
サンプル
</div>

<div style="
border-style:outset;/*枠線のスタイル*/
border-color:#aaaaff;/*枠線の色*/
border-width:2px;/*枠線の太さ*/
width:300px;/*枠線の横の長さ*/
height:50px;/*枠線の縦の長さ*/
padding:1px;/*枠の中の文字（画像）と線との余白*/
text-align:left;">
サンプル
</div>