개인용 상업용 무료이며 10종의 폰트입니다.
개인용 무료입니다.
Public Domain으로 개인용 상업용 무료입니다.
블로그를 시작하면서 처음 계획한 것이 블로그를 통해 글을 발행하면서 어느 정도 글이 모아지면 책을 만드는 일이었습니다. 책을 만든다는 것이 생각하기에 따라서는 거창한 일인 것 같지만 전혀 아닙니다. 예전에는 책을 만들기 위해서 원고를 만들고 출판사와 협의를 하고 커버디자인과 내부 디자인을 하든 등 상당히 어려운 작업이었지만 지금은 전자책이라는 것이 있어서 출판사나 인쇄소를 거치지 않고도 얼마든지 책을 만들 수 있습니다. 필요하다면 전자책을 인쇄물로 만들어 실제 책(Physical Book)을 만들 수도 있는 것입니다. 국제적으로 표준으로 되어있는 PDF파일은 전자책의 대표적인 예입니다. 현재는 전자책이라고 하면 e-Book으로 통하는데 다양한 형태의 e-Book이 나오고 있습니다. 대표적인 것이 e-..
개인용 무료입니다.
이전 글에서 float와 clear의 기본적인 사용법을 알아보았습니다. 이번 글에서는 미니 웹사이트에서 실제로 어떻게 적용되는지 알아보겠습니다. 그리고 웹사이트 만드는데 있어서 사용되는 파일이 늘어나면 관리하기가 어려워지므로 폴더를 만들어 서로 비슷한 성격을 가진 파일을 한데 모아서 관리하면 편리하므로 파일관리시 반드시 사용하게 되는 절대주소와 상대주소에 대해서도 알아봅니다. 우선 이번 글에서 사용할 파일을 다운 받습니다. 이 파일에는 아래 이미지처럼 사진이미지가 있고 빈 폴더가 있습니다. 이전까지는 html 파일과 스타일시트 파일만 있어서 간단한 구조이므로 파일관리가 필요하지 않았지만 이미지가 늘어나거나 제이쿼리 파일이 첨부되면 루트폴더가 복잡해집니다. 그래서 같은 종류의 파일은 폴더를 만들어서 이동해..
이전 글에서 본문 영역에서 컨텐트와 사이드바를 좌우로 정렬할때 float: left;와 float: right; 라는 속성과 값을 사용하여 컨텐트 영역은 좌측에 사이드바 영역은 우측에 배치를 했습니다. float라는 말은 영어로 띄운다는 뜻으로 웹페이지상에서 이 속성을 사용하면 해당 요소는 붕 뜨게 되고 포지션에서 절대위치와 같은 효과가 나타납니다. 그래서 어떤 요소에 float를 사용한 경우 다른 요소와 겹치게 되는데 이를 방지하기 위해 뒤따라오는 요소를 clear라는 속성으로 겹치지 않게 합니다. 이번글에서는 이러한 float라는 속성과 clear라는 속성을 이용하여 여러가지 요소에 대해 다양한 레이아웃을 하는 방법을 알아봅니다. float.html파일을 텍스트 에디터에 열면 3개의 id 선택자에 f..
오늘은 아침부터 블로그 스킨 수정하느라고 바쁘네요. 티스토리 공지에서 오늘 날짜로 인터넷 익스플로러 호환성 모드가 변경된다고 해서 IE에서는 어떻게 보일까 점검했더니 그동안 이상하게 나오던 것들이 다 수정돼서 나오더군요. 1처럼 겹치는 부분에 줄이 생기고 화면 하단에 스크롤 바가 생겼죠. 다른 웹브라우저에서는 이렇게 나오지 않았거든요. 티스토리에서 IE 8/9 호환성모드를 개선하는 바람에 위 증상은 말끔히 사라졌습니다. 그런데 문제는 상단의 메뉴바가 구글 애드센스 광고와 너무 가까워져서 간격을 늘리려고 스킨 수정 작업을 했습니다. 그런데 마우스 클릭을 잘못하는 바람에 애드센스 광고를 클릭하고 말았습니다. 아차 싶더군요. 어떤 불이익을 당하지 않을까.. 해서 구글에 검색을 했습니다. Accidents ha..
위젯은 여러가지 블로그프로그램에서 다른 의미의 용어로 사용되고 있습니다. 티스토리는 사이드바에 있는 카테고리나 최근글 같은 기본적으로 사용되는 요소를 추가하거나 제거할 수 있는 부분을 모듈이라하고 위젯뱅크에서 코드를 복사해서 임의로 추가할 수 있는 부분을 위젯이라고 합니다. 모듈이라고 하면 익스프레스 엔진이나 드루팔에서는 블로그 프로그램에 보조적으로 사용되는 작은 프로그램으로 티스토리의 모듈 개념과 다릅니다. 이러한 위젯이나 모듈을 하나의 용어로 통일을 하자면 플러그인이라고 하는 것이 좋습니다. 플러그인이란 기본적인 프로그램에 그 프로그램의 사용을 확대하기 위해서 사용하는 작은 프로그램으로 설치하고 배치만 하면 사용이 가능합니다. 워드프레스에도 별도의 플러그인 개념이 있는데 사실 위젯이나 플러그인이나 마..
이전 글에서 상대위치(Relative Position)에 대해서 알아보고 제목타이틀에 상대위치를 적용해서 리본만들기를 해보았습니다. 이번 글에서는 포지션의 다른 속성인 절대위치(Absolute Position)를 이용한 포지션 방법과 고정위치(Fixed Position)을 이용해서 html 요소를 화면에 고정시키는 방법을 알아봅니다. 1. 절대위치를 이용한 요소의 포지션 첨부파일을 열어보면 html부분과 CSS부분이 좀 바뀌었습니다. 1은 2부분을 스타일링한 것인데 마우스 스크롤시 화면이 이동되는 것을 보기위한 용도로 삽입한 것입니다. div#third 는 두개의 클래스 div요소를 삽입하고 다시 각각의 요소에 태그로 숫자를 넣었습니다. 우선 이전 글에서 한 내용을 기억을 되살려서 상대위치를 적용해봅니다..
개인용 무료입니다.
개인용 무료입니다.