demun(대문블로그)

퍼블리셔/Bootstrap2013. 10. 10. 01:00

부트스트랩의 미디어객체는 다양한 유형 즉 블로그의 댓글이나 트위등에 사용하기 좋은 스타일입니다. 이미지를 왼쪽이나 오른쪽에 붙일 수도 있습니다. .media 클래스를 사용하며 다음에 오는 요소로 왼쪽에 배치하고 싶으면 .pull-left 오른쪽으로는 .pull-right 클래스를 사용합니다. 기본 형태는 미디어 객체 즉 이미지, 동영상, 소리 등을 왼쪽이나 오른쪽에 배치합니다.아래 예제는 64*64 의 이미지를 배치한 형태입니다. 리스트 형태.댓글이나 기사목록등에 사용하면 좋은 형태입니다.리스트 태그인 ol 또는 ul 에 .media-list 클래스로 감싸는 형태입니다. List group 부트스트랩에서는 다양한 형태의 목록을 지원합니다.기본 형태는 ul 등에 .list-group 클래스를 사용하며 테두..

퍼블리셔/SublimeText2013. 10. 9. 01:00

Sidebar Enhancements 는 Sublime Text(서브라임텍스트)의 사이드바 기능을 좀 더 향상시킨 기능을 제공합니다. 간단한 사용법에 대한 글은 제가 이전 포스트를 참고하시기 바랍니다. 사이드바 확장 => http://demun.tistory.com/2225 사이드바 확장은 기존 서브라임 텍스트 2에서 사용하던것에서 3버젼이 발표되고 플러그인도 업데이트 되었습니다. 이전 SidebarEnhancements => https://github.com/titoBouzout/SideBarEnhancements 업데이트 된 SidebarEnhancements => https://github.com/titoBouzout/SideBarEnhancements/tree/st3 업데이트 된 사이드바 향상(S..

퍼블리셔/Bootstrap2013. 10. 8. 01:00

부트스트랩 Bootstrap 3 에서는 이미지, 비디오, 텍스트 등을 쉽게 그리드하려면 썸네일 컨포넌트와 부트스트랩의 그리드시스템을 이용하라고 합니다.부트스트랩에서 썸네일은 최소한의 필수 마크업으로 인한 링크 이미지를 보여주기위해 고안되었다고 합니다.아래는 기본 예제입니다. 링크 안에 이미지가 존재하는 형식입니다. 콘텐츠에 맞게 제작도 가능합니다.약간의 추가 마크업으로 이미지와 텍스트, 그리고 버튼 등이 같은 너비에 보여지도록 가능합니다. 아래 코드를 보시면 아시겠지만 이미지 아래에 caption 이라는 클래스를 사용해서 컨텐츠를 삽입하면 됩니다. Alerts (경고창) alerts 는 일반적으로 경고창(알림)을 말합니다. 무언가 정보를 알릴때 팝업창으로 떠서 정보를 알릴때 사용하는데요. 이와 비슷한 기..

퍼블리셔/SublimeText2013. 10. 7. 01:00

Sublimerge 사용법은 무척 간단합니다. 단축키 한두개 정도만 알면 사용하는데 어려움이 없을정도로 무척 간단합니다. 파일을 보는 방법과 코드를 비교해서 보는 방법에 대한 단축키가 있습니다. 아래 단축키를 누르기전에 먼저 비교해볼 수 있는 파일 두개를 여세요.제가 예제로 아래처럼 1.css 와 2.css 두개를 만들어놨습니다. 메뉴에서 View - Layout 에서 Columns 2 를 클릭해서 두개다 볼 수 있도록 했습니다. 그럼 어떻게 사용하는지 볼까요. 파일 보기 파일보기는 Ctrl + Alt + D 를 클릭하면 됩니다.위와 같이 두개의 파일을 연 상태에서 Ctrl + Alt + D 를 클릭합니다.그럼 아래처럼 Compare to View 가 나옵니다. 엔터. 그럼 열러있는 파일중에서 동기화, ..

퍼블리셔/SublimeText2013. 10. 5. 12:29

Sublimerge 는 Sublime text 서브라임텍스트에서 비교 및 병합을 할 수 있는 플러그인입니다.아래 이미지를 보시면 아시겠지만 왼쪽과 오른쪽을 비교해서 뺄건 빼고, 넣을건 넣고 할 수 있는 플러그인입니다. 지원 운영체제 : OS X, Windows, Linux지원 버전관리 도구 : Git, Subversion, Mercurial(곧 지원한다고 합니다.) Why do you need it? (필요성) Sublime text 서브라임 텍스트 전체 통합 - 외부도구의 도움없이 서브라임텍스트에서 통합을 할 수 있습니다.간단하고 생산성이 좋음. - 단축키나 키보드의 몇가지 키만 배워서 누르기만 하면 간단하게 통합을 할 수 있습니다.비교해서 차이점을 보여줍니다. - 변경된 부분을 블럭을 잡아서 어떻게 ..

퍼블리셔/SublimeText2013. 10. 4. 23:00

Auto Complete 자동완성이란 한개의 문자 또는 몇개의 문자를 입력했을때 팝업으로 입력한 문자의 완성된 글자 또는 단어, 코드를 나타내는 것을 말합니다.이것은 기본으로 활성화되어 있습니다. Disabling Auto Complete (자동완성 비활성) 자동완성을 사용하고 싶지 않을때 따로 설정을 통해서 비활성화 시킬수 있습니다.Sublime Text(서브라임 텍스트)에서 메뉴에서 Prefernces - Settings - Default 를 클릭합니다. 그러면 아래와 같은 화면이 나옵니다. Ctrl + F 를 눌러서 auto_complete 로 검색을 하면 아래처럼 기본값이 true 로 나온것을 알 수 있습니다. "auto_complete": false 로 변경하기만 하면 자동완성기능은 끌수가 있습..

퍼블리셔/Bootstrap2013. 10. 3. 01:00

Jumbotron 과 Page header 에 대해서 이야기 합니다.부트스트랩에서 말하는 Jumbotron 은 사이트에서 주요 내용을 소개하기 위한 박스 형태의 스타일을 말합니다.메인페이지에 보면 컨텐츠 상단에 가장 중요한 글이나 주요내용을 표시하는 공간이 있는데요. 바로 그런 부분을 말합니다. Page header 은 해당 페이지의 제목부분에 해당하는 부분을 말합니다. Jumbotron 위에서도 말했듯 페이지의 주요내용이나 중요 콘텐츠를 줄여 표기하기 위한 공간을 말합니다.그런 공간을 사용하라고 부트스트랩에서는 따로 클래스를 만들어놨습니다..jumbotron 클래스를 사용하면 되는데요. 여기안에 .container 를 사용하면 적절한 여백을 유지하며 둥근 모서리를 제공합니다. Page header 페이..

퍼블리셔/Bootstrap2013. 10. 2. 01:00

라벨과 벳지.여기서 라벨 label 은 input 에 사용되는 그 라벨이 아닙니다.텍스트상에서 어는 한 부분을 강조하거나 다르게 보이게 위한 스타일을 입힌 부분입니다.벳지도 마찬가지 입니다. Labels 먼저 기본 스타일입니다. 참고할 점은 아래의 라벨 크기는 라벨에 크기를 설정한것이 아니라 텍스틀에 크기를 설정한 것입니다. 즉 첫번째것은 ....... 입니다. 라벨은 다른곳과 마찬기자로 클래스가 두개로 만들어집니다..label 클래스는 라벨의 기본 스타일을 지정하고 뒤에 이어지는 .label-* 는 그 상태,모양을 나타냅니다. Badges 뱃지는 읽었거나 읽지 않았거나 할때 자주 사용합니다. 아래처럼 받은 편지함의 42개의 메일이 왔다는 형식으로 사용합니다..badge 라는 클래스를 사용합니다. Sel..

퍼블리셔/Bootstrap2013. 10. 1. 01:00

빵조각인 Breadcrumbs 와 페이징인 Pagination 을 이야기 합니다.빵조각은 영어로 Breadcrumbs 라고 말하는데 뜻은 탐색 계층구조에서 현재 보여지는 페이지를 보여주는 것을 말합니다.(카테고리라고 말해도 뜻은 어느정도 맞다고 봅니다.)티스토리에서 현재 페이지처럼 Home > 블로그 글 이렇게 쓰면 이해가 되실려나...... 또는 Home > 카테고리1 > 카테고리1-1 이런식으로 현재보여지는 페이지가 어느 위치에 해당하는지를 보여주는것이 바로 Breadcrumbs(빵조각) 입니다. 페이징은 현재페이지를 기점으로 다음페이지가 있거나 이전페이지가 있을때 다음이나 이전으로 넘어갈 수 있는 링크들의 모음입니다.즉 페이지넘김이죠. Breadcrumbs 기본 스타일은 아래와 같습니다. 아래 이미..

티스토리/티스토리초대장2013. 9. 30. 21:34

티스토리 초대장을 배포합니다. 많이는 없습니다. 활동을 안해서인지.....아래 댓글에 이메일주소와 어떤 블로그를 만들것인지 간략하게 적어주세요.비밀글에 체크하세요. i n v i t a t i o n 티스토리 초대장 + 남은 초대장 수 : 00 안녕하세요! 티스토리에 보금자리를 마련하시려는 여러분께 초대장을 배포해 드리려고 합니다. 나만의, 내 생각을, 내 기억을 담는 소중한 블로그를 만들고 싶다면 티스토리로 시작해보세요! 티스토리 블로그는 초대에 의해서만 가입이 가능합니다. 원하시는 분은 댓글에 E-mail 주소를 남겨주시면 초대장을 보내드립니다. 남겨주실 때에는 꼭 비밀댓글로 남겨주세요! 초대장을 보내드리고 바로 개설하시지 않으신 분들은 초대장을 회수할 수도 있으니 바로 개설해주세요! Yes 이런 분..