본문 바로가기

전체 글229

CSS 클래스(class), 아이디(id) 좋은이름 나쁜이름 클래스나 아이디의 이름을 부여할때 후에 고칠수 있는 점을 고려하여 명명하는것이좋다. 예로 왼쪽 메뉴를 leftNav라고 하는것보다 후에 오른족을로 변경되점을 고려하여 subNav라고 붙이는 것이좋다. 과도히 긴 이름은 좋지않다. 이름을 두가지 의미를 포함 하기 마련인데 중간에 대문자로 구분해주자 subnav 이거보단 subNav 그리고 XHTML마크업의 경우 대소문자를 구분하지만 HTML마크업의 경우 대소문자를 구별하지않는다. 2009. 8. 29.
CSS 지정순위 CSS 지정순위 선택자 지정순위 10진수환산값 style=" " 태그에 직접 삽입지정 1000 1000 #content #content{} 아이디 아이디 0200 200 #content .content{} 아이디 클래스 0110 110 div#content{} 태그지정 아이디 0101 101 #content{} 아이디 0100 100 div .content .comment{} 태그지정 클래스클래스 0021 21 div. content{} 태그지정 클래스 0011 11 div p{} 태그 태그 0002 2 p{} 태그 0001 1 지정순위가 높을수록 우선시 된다. 기본적으로 아이디>클래스>태그 예로 html이 다음과 같고 테스트 CSS p{ font-color:#ffcccc;} #Content{ font-.. 2009. 8. 29.
문서유형 doctype 전환 브라우저 모드 DTD(document type Definition)문서타입 정의 DTD는 어떤내용은 허용하고 어떤내용은 허용하지않는가의 내용을 가지고 있다 .각 브라우저는 이에따라 웹문서를 해석할 때 문밥에 맞는지 제대로 동작하는지를 검사하게된다. 브라우저모드 호환성을 준수하기위해 노력해왔고 이를 위해 화면에 표시하기위한 엔더링모드를 두가지로 나뉘었다. 표준(standard)호환모드 비표준(quirks)확장모드 이다. 표준호환모드는 기술 명세서의 냐용대로 페이지를 화면에 표시하고 비표준 확장모드일때는 좀더 느슨하게 하의 호환을 고려하여 페이지를 화면에 표시한다.예로 비표준 확장모드는 과거 익스플로어 버전에서 페이지가 깨져 보이지않도록 한다. 아래는 어던 DOCTYPE일때 어던 렌더링 모드로 작동하는지 한눈에 알아볼 수.. 2009. 8. 29.
카페베네 공모전 스킨 카페베네 스킨공모전에 제출했던것. gif로 애니매이션 추가할껄이라는 아쉬운생각이.. 2009. 8. 24.
블로그 코드 삽입 SyntaxHighlighter와 그외 방법 블로그 코드 삽입 웹,또는 프로그래밍 관련 포스팅을 하는 블로거에게는 코드삽입 해야 될것이 필수이다. 이 같은 소스를 쉽게 보여주기 위해 사용하는 것 SyntaxHighlighter 가장많이 사용해 왔던것들 이에대한설명은 많고 버전도 여러가지고 설치방법도 찾아보면많다. 일단 추천링크 아래블로그가서 따라하면 된다. http://babochi.tistory.com/7 , http://babochi.tistory.com/6 http://rookiecj.tistory.com/232 #SyntaxHighlighter{ display:block; color:#000;} 위와같이표현되는것을 볼수있다. 설치에 너무부담있고.. 보기에도 그닥 좋지않아서 다른걸 우연히발견했는데.. 다음은 최근 내가 포스팅하면서 쓰는것 hi.. 2009. 8. 20.
G8 로고 G8 로고 2009 g8 정상회담 2009. 7. 9.
going green CNN project 2009. 7. 8.
Letícia Birkheuer 2009. 7. 6.
DOM 라운드박스 심플 먼저 올린 라운딩 박스는 가로 세로 내용물 모두 자유롭게 설정가능하다. 그런데 굳이 가로가 일정치라면 그방법대로 할필요가 없다. 이번엔 가로 사이즈가 정해진경우 목적은 태그 내용물 //아래 라운드박스 //먼저요구되는건 insertAfter 함수. insertBefore은 스크립트에서 지원되지만 insertBefore은 없다 //두함수의 기능은 insertBefore(A, B); :B 엘레먼트앞에 A를 삽입 insertAfter(A, B); :B 엘레먼트뒤에 A를 삽입 //먼저 insertAfter을 만들어준다, 원리는 insertBefore를 역이용한것이다. function insertAfter(newElement,targetElement) { var parent = targetElement.parent.. 2009. 7. 2.