demunWhite 3단 티스토리 스킨
- 티스토리/스킨배포
- 2012. 1. 20. 16:32
demunWhite 스킨이 1단,2단,3단 각각 존재합니다. 2단과 3단을 같은 글에 써서 글을 두개로 분리했습니다.
전제적인 특징은 2단 스킨에 대한 글을 참고하세요. 자세히 적었습니다.
demunWhite 3단 스킨도 2가지 테마를 가지고 있습니다. 화이트, 블랙
테마는 화이트가 기본입니다. 이름을 정할때 다른 스킨들도 화이트라는 이름이 많아서 저는 구별하기위해 demun 이라는 이름을 붙였습니다.
그래서 기본 이름은 demunWhite 입니다.
기본 테마는 화이트테마로 만들어졌지만 어두운 색을 좋아하는 사람을 위해 블랙테마도 적용할 수 있습니다.
이 또한 스타일을 덮어쓰는 형식을 취했으며 초보자를 위해 간단하게 변경하도록 만들어졌습니다.
아래 그림을 보시면 black.css 한줄이 주석처리 되어 있습니다. 이걸 해제하면 블랙테마로 사용이 되고 주석처리하면 화이트테마로 사용할 수 있습니다.
확장성을 위한 것이죠.
사실 시간만 더 투자하면 다른 테마도 적용이 가능합니다.
나머지 한개는 넓은 해상도에 사용할 수 있도록 했으며 해상도 1280에 맞추어서 사용하도록 너비가 1200px 로 고정이 되어 있습니다.
그래서 아래처럼 골라서 사용하고, 테마도 선택적으로 사용할 수 있습니다.
본문이나 컨텐츠 있으면 상관이 없는데, 내용이 없으면 하단의 footer 가 위로 달라붙는 현상이 있습니다.
이 레이아웃을 먼저 잡아주고 스킨을 만들어야하는데 안그런 경우가 많지요.
저도 예전에는 그냥 만들었었는데요..이번에는 높이 100%를 유지한채 스킨을 만들었습니다.
아래 그림은 높이를 유지하지 않은채 만든경우입니다.
모든 스킨은 나눔고딕이 기본 글꼴로 되어 있습니다.
또한 접근성이 않좋으신분을 위해 본문으로 바로가기 링크를 모두 포함하고 있습니다.
각각의 해상도와 테마별 스샷을 참고하시기 바랍니다.
아래의 스샷은 전체 스샷을 찍어서 매우 큰 이미지입니다.
각 제목을 클릭하면 보여지고 , 다시 클릭하면 감쳐집니다.
또 이미지를 클릭하시고 이미지에 마우스를 대시면 확대하는 그림이 나옵니다. 그럼 확대해서 보시면 전체해상도로 보실수 있습니다.
추가합니다.
2012-1-16
이전에 불필요하게 추가된 코드 정리했습니다.
#tabbox 와 .taglog 부분 수정했습니다.
전제적인 특징은 2단 스킨에 대한 글을 참고하세요. 자세히 적었습니다.
demunWhite 3단 스킨도 2가지 테마를 가지고 있습니다. 화이트, 블랙
테마는 화이트가 기본입니다. 이름을 정할때 다른 스킨들도 화이트라는 이름이 많아서 저는 구별하기위해 demun 이라는 이름을 붙였습니다.
그래서 기본 이름은 demunWhite 입니다.
1. 화이트 테마, 블랙 테마.
이 스킨은 애초에 기획단계부터 다른 테마와 같이 사용할것을 전제로 만들어졌습니다.기본 테마는 화이트테마로 만들어졌지만 어두운 색을 좋아하는 사람을 위해 블랙테마도 적용할 수 있습니다.
이 또한 스타일을 덮어쓰는 형식을 취했으며 초보자를 위해 간단하게 변경하도록 만들어졌습니다.
아래 그림을 보시면 black.css 한줄이 주석처리 되어 있습니다. 이걸 해제하면 블랙테마로 사용이 되고 주석처리하면 화이트테마로 사용할 수 있습니다.
확장성을 위한 것이죠.
사실 시간만 더 투자하면 다른 테마도 적용이 가능합니다.
2. 해상도에 따른 스킨 적용.
두개는 1024의 해상도에서 볼수 있도록, 광범위하게 사용하도록 너비가 960px 로 고정이 되어 있습니다.나머지 한개는 넓은 해상도에 사용할 수 있도록 했으며 해상도 1280에 맞추어서 사용하도록 너비가 1200px 로 고정이 되어 있습니다.
그래서 아래처럼 골라서 사용하고, 테마도 선택적으로 사용할 수 있습니다.
- 너비 980px.흰색테마 - 본문너비(600px), 왼쪽사이드바너비(120px), 오른쪽사이드바너비(200px)
- 너비 980px.블랙테마 - 본문너비(600px), 왼쪽사이드바너비(120px), 오른쪽사이드바너비(200px)
- 너비 1200px.흰색테마 - 본문너비(730px), 왼쪽사이드바너비(160px), 오른쪽사이드바너비(250px)
- 너비 1200px.블랙테마 - 본문너비(730px), 왼쪽사이드바너비(160px), 오른쪽사이드바너비(250px)
3. 높이 100%가 유지되는 레이아웃.
스킨을 보면 높이 100%유지하지 않고 그냥 사용하는 경우가 자주 있습니다.본문이나 컨텐츠 있으면 상관이 없는데, 내용이 없으면 하단의 footer 가 위로 달라붙는 현상이 있습니다.
이 레이아웃을 먼저 잡아주고 스킨을 만들어야하는데 안그런 경우가 많지요.
저도 예전에는 그냥 만들었었는데요..이번에는 높이 100%를 유지한채 스킨을 만들었습니다.
아래 그림은 높이를 유지하지 않은채 만든경우입니다.
모든 스킨은 나눔고딕이 기본 글꼴로 되어 있습니다.
또한 접근성이 않좋으신분을 위해 본문으로 바로가기 링크를 모두 포함하고 있습니다.
이것은 지켜주세요!!
하단에 저작권은 수정하지 말아주세요.
개인 스타일에 맞게 수정해달라고 애프터서비스 신청하지 마세요.(버그나 잘못된 점이 있으면 수정해드릴수 있으나 이미 제작된 스킨을 본인의 스타일에 맞게 자꾸 변경해달라고 하시는 분들이 있습니다)
배포된 스킨을 다른곳에서 배포하지 말아주세요. 다른곳에서 배포는 금지입니다. 링크를 알려주세요.
개인 스타일에 맞게 수정해달라고 애프터서비스 신청하지 마세요.(버그나 잘못된 점이 있으면 수정해드릴수 있으나 이미 제작된 스킨을 본인의 스타일에 맞게 자꾸 변경해달라고 하시는 분들이 있습니다)
배포된 스킨을 다른곳에서 배포하지 말아주세요. 다른곳에서 배포는 금지입니다. 링크를 알려주세요.
각각의 해상도와 테마별 스샷을 참고하시기 바랍니다.
아래의 스샷은 전체 스샷을 찍어서 매우 큰 이미지입니다.
각 제목을 클릭하면 보여지고 , 다시 클릭하면 감쳐집니다.
또 이미지를 클릭하시고 이미지에 마우스를 대시면 확대하는 그림이 나옵니다. 그럼 확대해서 보시면 전체해상도로 보실수 있습니다.
demunWhite 화이트 테마 3단 스킨 스샷
demunWhite 블랙 테마 3단 스킨 스샷
demunWhite 흰색테마 3단 스킨 1280해상도 스킨 스샷
demunWhite 블랙 테마, 3단 스킨 1280해상도 스킨 스샷
참고
스킨 배포는 이메일로만 배포합니다. 이 스킨은 무료입니다. hjm01@naver.com
누구나 스킨을 사용할 수 있는 무료스킨이지만 블로그게시글이 없는분, 블로그를 한지 얼마 안되는분에게는 배포하지 않습니다.
스킨을 적용하신 다음에는 현재의 글에 트랙백을 주세요.
이는 다른분들에게 미리보기를 제공하기 위함입니다. 본인의 방문자수 증가에도 도움이 될겁니다.
다른 해상도를 지원하는 스킨은 아래의 글을 참고하세요.
demunWhite 2단 스킨
demunWhite 1단 스킨
누구나 스킨을 사용할 수 있는 무료스킨이지만 블로그게시글이 없는분, 블로그를 한지 얼마 안되는분에게는 배포하지 않습니다.
스킨을 적용하신 다음에는 현재의 글에 트랙백을 주세요.
이는 다른분들에게 미리보기를 제공하기 위함입니다. 본인의 방문자수 증가에도 도움이 될겁니다.
다른 해상도를 지원하는 스킨은 아래의 글을 참고하세요.
demunWhite 2단 스킨
demunWhite 1단 스킨
추가합니다.
2012-1-16
이전에 불필요하게 추가된 코드 정리했습니다.
#tabbox 와 .taglog 부분 수정했습니다.