HTML 문서를 태그를 이용하여 작성하면서 글이 흘러가며 각 글, 즉 태그들은 각각의 크기를 가집니다. 가변적인 크기일 수도 있고 고정적 크기일 수도 있습니다. 하지만 그걸 떠나서, 태그가 박스 형태의 사각 영역을 가질수 있느냐 없느냐가 레이아웃을 생각하는데 기본이 됩니다. 우선 예를 봅시다. 애국가 1~4절, 즉 텍스트 내용이 담긴 4개의 박스를 위치를 따로 지정하지 않고 CSS 속성만 가지고 글 흐르듯 배열되어 보이도록 한것입니다. 코드는 아래와 같습니다. 123456789101112131415161718192021222324252627282930313233343536p{ background: #CCC; display: inline; display: inline-block; zoom: 1; width..

치환자에 대하여 잘 이해하기 위해서는 바로 치환 해 보면 알겠지요? 우선 이전 2번째 글에서 이제 더미 스킨 블로그를 만들었습니다. 이제 굳이 코드 프로그램 없이 순수하게 티스토리 설정에서 스킨변경에 있는 HTML 수정 기능으로만으로 페이지를 다듬어 갈 수 있습니다. 일단 무턱대고 해봅시다. 블로그 설정에서 스킨변경>HTML 수정을 눌러서 header 라고 적혀 있는 부분을 라고 바꾼후왼쪽 미리 보기 화면의 [새로고침]을 눌러봅시다. 그러면 미리보기의 상단의 글이 자신의 블로그 이름으로 나오게 됩니다.바로 이해 되시죠? 치환자는 크게 두가지입니다. 단순히 1:1로 값만을 의미하는 치환자, 이런것과 같은 HTML 태그를 닮은 고유의 티스토리 치환자, 2가지입니다. 값은 위에 해보셨으니 아실태고, 아래의 태..

티스토리가 개편 이전에 꾀 구체적으로 스킨 제작에 대한 가이드가 나름 구체적으로 볼만했는데. 개편 이후 싹 없어졌는지 찾아볼 수 없어졌고. 너무 간편해진 도큐먼트 페이지만 하나 생겼습니다. 일단 볼것이 이것밖에 없기때문에 이것을 토대로 하나씩 따라가면서 스킨 구조를 파악 해 봅시다. 아 그전에. 새 스킨을 만들생각을 하셨으면. 기존의 블로그를 사용하시면 스킨을 제작 수정함에 있어서 사용자에게 무리가 갈 수 있으니. 꼭 새로운 스킨 제작용 블로그를 하나 만드셔서 테스트 글, 태그, 댓글, 방명록, 등을 여러개 생성해 둡시다. https://tistory.github.io/document-tistory-skin/common/files.html우선 공식 도큐먼트에서 스킨파일 구조를 어떻게 짜야하는지 읽어 봅시..

블로그나, 직접 웹사이트를 제작할때 다른 폰트를 사용하고 싶은경우가 있습니다. 기본 굴림체를 진짜 극혐하는 사람들이 존재하죠. 저도 마찬가지입니다. 내가 가지고 있는 폰트를 가지고 웹페이지를 만든다 한들, 그것을 보는 사람들이 폰트가 없다면, 다른 폰트로 대체될 수밖에 없죠. 다른 방법으론 그 폰트 자체를 같이 파일목록에 업로드하는 것이겠지만. 일반 블로거나 개발자에겐 그 폰트 용량 때문에 트래픽이 문제가 될 수 있습니다. 그래서 대안은, 웹페이지를 보는사람이 그 페이지에서 사용되는 폰트를 다른 서버에서 자동으로 다운받아지게끔 하는것입니다. 가장 잘 되어있는 것이 바로 구글 폰트죠.https://fonts.google.com/구글 폰트에 가보시면, 상업적으로 이요해도 되는 무료 라이센스 폰트들이 등록되어..