본문 바로가기

css관련기록

게시판 리스트 앞에 점 이미지를 붙였을때 틀어지지 않고 제작하는 방법 ie 6 /7 /8 전부 적용됨 앞 내용에 span값을 주고 뒤에 날짜에 span값을 준다.. float는 앞span과 뒤span을 다 주어야 틀어지지 않는다.. /style .bodList { clear:both; padding-top:10px; } .bodList li { background:url(../images/bul_dot.gif) left center no-repeat; line-height:21px; padding-left:9px; } .bodList li span { font-size:11px; } .bodList li span.left { float:left;} .bodList li span.right { float:right; }.. 더보기
ie 6에서는... width값과 height 값을 꼭 지정해줘야한다 div에 position 값을 주어도 div 태그안에 width값과 height 값이 지정되지 않으면.. 위치가 벗어나는 경우가 발생한다.. 더보기
image sprite로 제작되는 부분 image sprite 이미지 앞으로가기뒤로 가기 ------------------------------------------------------------------ 네이버 버튼 부분 온 오프 아웃 마우스 효과 마우스 이미지를 효과별로 만들어서 따로 지정해서 넣는다 검색버튼 더보기
line-height 값에 대해서 내가 매일 헷깔려 하는것.. li 값에 클래스를 입히고 그안에 백그라운드 이미지를 넣을 경우 li 안에 일반 텍스트글과 일정한 가운데 정렬이 되는지 부분이다.. 이럴때는 line-height를 줘서 그 글자에 간격을 줘서 이미지를 정렬시켜야한다.. line-height 값은 18px 기본으로 주면 해결된다 더보기
스타일시트 기초 자바스크립트 스타일시트 ☞스타일의 사용 -------------------------------------------------------------------------------- ☞스타일의 지정 -------------------------------------------------------------------------------- 1. 태그로 지정 : td{...} 2. 클래스로 지정 : .text{...} -> 3. 아이디로 지정 : #text{...} -> ☞ 폰트 속성 -------------------------------------------------------------------------------- ※ 윈도우기본폰트 : 굴림, 굴림체, 궁서, 궁서체, 돋움, 돋움체, 바탕,.. 더보기
Collapsing margin(마진통합) 현상 div 안에 마진값이 같이 먹는 경우.. 이 경우에는 min-height 값을 주거나 부모 div에 float 값을 주면 된다 더보기
float:left와 float:right , position:relative와 position:absolute 정렬 float:left와 float:right 그리고 position:relative와 position:absolute을 통한 상하좌우 정렬 1. float float:left = 자식요소의 좌표값를 부모 요소의 x=0, y=0 float:right = 자식요소의 좌표값을 부모 요소의 x=(부모요소의 넓이-자식요소의 넓이), y=0 2. position position:relative = 상위요소로 부터 자신의 상대위치를 지정 position:absolute = 부모요소로 부터 자신의 절대위치를 지정 position:fixed = 브라우저로 부터 자신의 절대위치를 지정(ie6 제외) 0 1 2 3 4 5 6 더보기