본문 바로가기

SKIN & CSS74

스킨을 반응형으로 만들자 요즘은 모바일 기기를 워낙 많이 쓰기 때문에 스킨을 만들 때 피씨 사용자만을 위한 디자인은 외면받기 쉽다. 스킨을 반응형으로 만들어야 하는 까닭이다. 고맙게도 티스토리 스킨 편집 화면에서는 아래와 같이 반응형이 제대로 작동하는지 미리 볼 수 있다. CSS에서는 미디어퀴리로 기기별로 설정을 따로 해줄 수 있다. .example { width: 500px; font-size: 1.5em; color:#000; } @media screen and (max-height: 800px) { .example { width: 190px; font-size: 1.0em; color:#ccc; } } 먼저 example 요소는 피씨로 접속한 화면에서는 위쪽 스타일로 보인다. 화면 폭이 800px이하인 모바일 기기로 접속한.. 2020. 11. 1.
티스토리 스킨 skin.html 구조를 알아 보자 티스토리 스킨을 만들거나 고치기 위해선 먼저 스킨 파일의 구조를 알아야 한다. 프로그래밍을 전혀 하지 못한다고 하더라도 간단한 부분을 고쳐서 개성이 드러나는 스킨으로 바꾸는 일은 크게 어렵지 않다. 잘못되면 다시 적용할 수 있는 스킨은 차고 넘치므로 두려워 하지 말고 나서 보자. 먼저 skin.html을 열어 보자. 확장자로 html 문법으로 쓰인 문서임을 알 수 있다. 구조를 간단하게 살펴보자. html 문서는 그 안에 작은 부분인 요소(element)가 들어 있다. 요소는 태그(tag)로 구분하는데 각 요소는 아래와 같이 여는 태그와 닫는 태그로 둘러싸서 적는다. html 문서를 수학 시간에 배운 집합으로, 요소는 원소로 생각하면 쉽게 이해할 수 있다. 요소의 예시 이 문서가 HTML5 문서임을 알린.. 2020. 11. 1.
반응형

티스토리툴바