HTML/CSS

XHTML

CSS - Border

WEBSP2012.02.07 13:13

조회 : 4,602

Border
Border는 테두리(라인)를 의미합니다.
디자인적 요소로 많이 사용되어 지고있으며 박스형태의 모양을 만들때 사용되어집니다.
 
Border의 속성은 Margin과 Padding과 마찬가지로 Top, Right, Bottom, Left 가 존재하며,
자체적 간격 조정은 없습니다.
디자인 요소이기 때문에 테두리(라인)의 두께나 색상, 그리고 모양의 속성을 적용 할 수 있습니다.
 
Border 속성
 
    border-color : 테두리(라인)의 색상 
 
        border-top-color: #FF0000;
 
 
    border-style : 테두리(라인)를 어떤 스타일로 할것인지 (ex, 점선, 실선, 라인)
 
        border-top-stle: solid;
        border-top-stle: dotted;
        border-top-stle: dashed;
 
    border-width : 테두리(라인)의 두께
       
      border-top-width: 1px;
 
 
TIP
이 많은 속성들을 개별적으로 적용한다면 선만 긋다 시간 다 보내겠죠?
Margin 이나 Padding 처럼 이 많은 속성들 또한 축약해서 하나로 묶어서 사용 가능합니다.
 
    테두리 모두 적용하기
 
        border: 1px solid #FF0000;
 
    테두리 위쪽만 적용하기
        border-top: 1px solid #FF0000;
   
    테두리 오른쪽만 적용하기
        border-right: 1px solid #FF0000;
 
    테두리 아래쪽만 적용하기
        border-left: 1px solid #FF0000;
 
    테두리 왼쪽만 적용하기
        border-left: 1px solid #FF0000;
 
 
Border의 형태는 직각으로만 표현이 가능하며,
둥근 모서리 형태의 Border는 CSS3에서는 존재합니다.
CSS3는 IE9(익스플로러9) 이상에서만 지원하며,
사파리, 크롬, 파이어폭스, 오페라 등의 표준 브라우저에서만 적용가능합니다.

0개의 댓글이 있습니다.

select count(*) as cnt from g4_login where lo_ip = '44.200.39.110'

1194 : Table 'g4_login' is marked as crashed and should be repaired

error file : /bbs/board.php