프린트시 스타일 달리 적용

보통 홈페이지에서 인쇄를 지원할때 인쇄가 안됐으면 하는 요소들이 분명히 있다.프린트 하기 버튼이라든지.. 뭐 그게 뭐든지 간에 프린트 할때 style을 달리 적용할수 있다.

@media print 는 프린트할때의 경우만 따로 스타일을 지정할수 있다.
예제1을 프린트할 경우는 본문 부분만 나온다.

디자인 셀렉트박스

확실하게 크로스브라우징이 되는 것들은 못본 것 같다.
밑에 이 소스는 select box의 style을 따라 같다거나 값을 넘겨준다거나 하는 것은 없다.
값을 넘기려면 type이 hidden인 input 을 만들어서 선택하는 function selecttxt 안에 해당 value를 넣어 주면 될 것이다.

모르는 부분은 없을 것이다.
포인트는 선택 했을때 innerHTML로 선택한 값을 보여준다.

푸터가 항상 밑에 붙어 있기

제목이 말하는 그대로다.
간혹 본문에 바로 밑에 푸터가 붙어 있을 경우 본문 내용이 적어서 푸터와 제일 밑 부분이 텅~~ 비워 질때가 있다.
뭐.. 개개인 취향이 그럴수도 있지만.. 내가 볼때는 영~~ 이상하게 보이더라.
table 로 레이아웃을 잡을때는 뭐 height: 100% 값이 잘 먹고 해서 쉽게 구현을 했지만..
처음 div로 레이아웃을 잡을때 이런 것 조차 왜 이렇게 잡기 힘들던지…
혹시나 도움이 될까 하고 적어 본다~

head 의 세로가 100px, body 를 margin-top 에 음수를 넣어서 위로 올린다.
body 밑에 foot 가 붙여야 함으로 foot를 보여주기 위해서 foot 의 세로 값 100px 까지 같이 올려 준다.
고로 margin-top: -200px;
body 안에 cnts 도 같이 올라가므로 이놈은 margin-top: 200px; 만큼 밀어 준다.
head , foot 높이 값이 변하면 body, cnts 의 margin-top 값도 신경써서 수정할수 있도록~