・背景色をつける場合はbackground-color: 色値
・ボックス内文字色はcolor: 色値
をそれぞれ付け加えて下さい。

boxsample1

boxsample2

boxsample3

boxsample4

boxsample5

boxsample6

boxsample7

boxsample8

boxsample9

boxsample10

.boxsample1 {
width: 45%;
height: 50px;
border: 5px solid #666666;
background-color: #ffffff;
}　▲トップへ
.boxsample2 {
width: 45%;
height: 50px;
border: 5px dotted #666666;
background-color: #ffffff;
}　▲トップへ
.boxsample3 {
width: 45%;
height: 50px;
border: 5px dashed #666666;
background-color: #ffffff;
}　▲トップへ
.boxsample4 {
width: 45%;
height: 50px;
border: 5px double #666666;
background-color: #ffffff;
}　▲トップへ
.boxsample5 {
width: 45%;
height: 50px;
border: 5px groove #666666;
background-color: #ffffff;
}　▲トップへ
.boxsample6 {
width: 45%;
height: 50px;
border: 5px ridge #666666;
background-color: #ffffff;
}　▲トップへ
.boxsample7 {
width: 45%;
height: 50px;
border: 5px inset #666666;
background-color: #ffffff;
}　▲トップへ
.boxsample8 {
width: 45%;
height: 50px;
border: 5px outset #666666;
background-color: #ffffff;
}　▲トップへ
.boxsample9 {
width: 45%;
height: 50px;
border-top: 5px solid #666666;
border-right: 5px solid #666666;
border-bottom: 5px solid #666666;
border-left: 20px solid #666666;
}　▲トップへ
.boxsample10 {
width: 45%;
height: 50px;
border-bottom: 5px solid #666666;
border-left: 20px solid #666666;
}　▲トップへ

記事を飾ろう！トップ
マージン、パディング基礎
背景色を指定する
背景画像を指定する
枠線幅を指定する
枠線色を指定する
枠線の種類を指定する
枠線ごとに一括指定する
幅、高さを指定する
ボックスサンプル集

次のキーワードを検索：[スタイルシート]

前後の記事

最近の記事