Daybreakin Things

Posted
Filed under 컴퓨터
지금까지는 보통 1cell 짜리 table을 이용하였는데 원래 그 기능을 하는 hr 태그를 이용해 보겠다.

CSS에 다음과 같이 정의하고 <hr/>라고 써주면 끝이다. ^^;

hr {
clear:both; /* (option) */
margin:5px auto; /* (option) */
padding:0px;
width:360px; /* 알아서 적절하게. %로 해도 됨 */
height:1px;
color:#2D520D; /* 여기와 아래에 같은 색을 넣음 */
background-color:#2D520D;
border:0px;
}
/* for IE */
* html p {
margin:0px;
}
* html hr {
margin:0px auto;
}

약간 tricky한 방법이긴 하지만 이렇게 하면 훨씬 간단하게, 단 네 글자 만으로 수평선을 만들 수 있다.

from 토끼군.

덧. 일반적인 디자인 용도로는, <div style="border-bottom: 1px solid red; height:1px; margin:0px; padding:0px"></div>가 더 쓰기 좋을 겁니다.

이렇게 말이죠. 다만 hr은 p 태그 사이, 글 중간에 넣을 때 줄 중간에 표시되는 성질이 있다는 게 좀 다릅니다.

요 몇 일 css로 html 만들기를 하던 중 1px 높이의 라인 만드는 것 때문에 머리가 아플 지경이었는데 아침놀님의 hr 로 라인 만들기를 통해 라인을 구현하였으나 뜻하지 않는 문...