<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>14.테두리 외곽선 스타일</title>
<style type="text/css">
.myButton
{
width:100px; height:50px;
background-color:Gray;
border-left-width:1px;border-top-style:solid;border-left-color:Red;
border-top-width:2px;border-top-style:dotted;border-top-color:Blue;
border-right-width:3px;border-top-style:groove;border-right-color:Green;
border-bottom-width:4px;border-top-style:dashed;border-bottom-color:Maroon;
}
.myButton1
{
border-left-width:3px;border-top-style:solid;border-left-color:Red;
border-top-width:3px;border-top-style:solid;border-top-color:Red;
border-right-width:3px;border-top-style:solid;border-right-color:Red;
border-bottom-width:3px;border-top-style:solid;border-bottom-color:Red;
}
.myButton2
{
border:groove 3px gray;
}
.myButton3
{
border-width:3px; border-style:dotted; border-color:Red;
}
</style>
</head>
<body>
<input id="Button1" type="button" value="외곽선정의" class="myButton" /> <br />
<input id="Button2" type="button" value="외곽선정의" class="myButton1"/>
<input id="Button3" type="button" value="외곽선정의" class="myButton2" />
<input id="Button4" type="button" value="외곽선정의" class="myButton3" />
</body>
</html>
'.Net Project > CSS 2.0' 카테고리의 다른 글
16장 CusorStyle (0) | 2009.07.28 |
---|---|
15장 배경 관련 스타일 (0) | 2009.07.28 |
13장 여백관련Style (0) | 2009.07.28 |
12장 TextStyle (0) | 2009.07.28 |
11장 SortStyle (0) | 2009.07.28 |