본문 바로가기

HTML, JAVASCRIPT

[웹디자인]HTML/표의 점선테두리와 프레임의 경계를 도트로

표의 점선테두리와 프레임의 경계를 도트로
보통 표에서 점선 테두리를 만들거나 프레임의 경계를
도트나 두께1의 실선으로 깔끔하게 하고자 할 때 이미지를 사용하는데요
아래 태그를 이용하시면 더 간단히 사용하실수 있답니다
단 점선은 익스 5.5 이상에서만 보인답니다
(이하에서는 실선으로 보여요)

① 먼저 테두리 전체를 점선또는 실선으로 하실 경우

먼저 각각의 border(테두리두께)를 0으로 해줍니다
다음의 스타일을 각각의 태그에 붙입니다

style="border:dotted 1 #999999;"

dotted → 점선 (실선일 경우 solid)
1 →  테두리 두께
#999999 → 테두리 색상


위의 스타일은 색상이 #999999인 테두리두께 1의 점선을 만든다는 의미입니다
실선의 경우에는 style="border:solid 1 #999999;" 와 같이 되겠죠 ^^?

테이블의 경우
<table  cellpadding="5" cellspacing="0" width="300" border="0" style="border:dotted 1 #999999;">

프레임의 경우
<frame src="문서.htm"  style="border:dotted 1 #999999;">

② 위,아래,왼쪽, 오른쪽 등으로 나눠서 지정하고 싶을 때

style="border-width:0px;border-bottom: dotted 1 #999999;"


방법은 위와 같구요

border-bottom 은 아래쪽 테두리입니다
왼쪽은 border-left
오른쪽은 border-rigtt
위는 border-top

만약 왼쪽,오른쪽을 사용하시고 싶으시다면

style="border-width:0px;border-left: dotted 1 #999999;border-right: dotted 1 #999999;"

위와 같이 왼쪽부분과 오른쪽부분 테두리를 각각 지정해주시면 됩니다

'HTML, JAVASCRIPT' 카테고리의 다른 글

브라우저에서 뒤로가기, 펑션키 막기  (0) 2011.04.25
javascript 에서 this.form 사용  (0) 2010.04.13
카렌다  (0) 2007.12.26
javascript 함수모음  (0) 2007.10.12