고정된 사이드배너
쇼핑몰이나 높이가 긴 사이트에 경우 왼쪽 또는 오른쪽에 배너영역을 지정하기도 한다.이때 화면상에서 스크롤에 상관없이 항상 같은 위치에 있게끔 하는 배너를 넣을땐
css의 position:fixed으로 간단히 해결할수 있다.
| <!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>고정된 사이드배너</title> <style type="text/css"> #sidebanner { position:fixed; top:50px; left:50%; margin-left:500px; width:100px; height:200px; background:#F9C; } #content { width:980px; height:2000px; margin:0 auto; background:#6CF; } </style> </head> <body> <div id="sidebanner"> 사이드배너 </div> <div id="content"> 컨텐츠내용 </div> </body> </html> |
