블로그 이미지
Magic_kit
study 관련자료를 한곳으로 자기 개발 목적으로 재태크 재무 관리 목적으로 일상생활의 팁을 공유 하기 위하여 블로그를 개설 하였습니다.

calendar

1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30

Category

Recent Post

Recent Comment

Archive

2009. 7. 28. 12:38 .Net Project/CSS 2.0
반응형


<!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
posted by Magic_kit