'부트스트랩' 태그의 글 목록::VICTORY

부트스트랩에 해당되는 글12건

이 블로그를 멋진 스킨으로 만들어야 하는데...

아직 생각나지 않는다. 현재 이 스킨은 내가 주로 운영하고 있는 부트스트랩3로 만든 백전백승을 기초로 해서 만들어서 너무 비슷하여 독특하지 않다. 부트스트랩3로 만든 스킨을 부트스트랩4을 사용해서 1단으로 만들었는데 어딘가 어색하다. 부스트스트랩 무료테마를 제공하는 사이트에서 좋은 테마를 제공하고 있지만 현재 마음에 드는 것이 없다. 그리고 새로 테마를 만들려면 시간이 걸린다. 자투리 시간을 내면서 스킨을 완성하고 있지만 귀찮다. 꾸미는 것도 시간과 노력이 엄청 걸리는 것을 안다. 부트스트랩5까지 나오기를 기다릴까?

2019.06.21

티스토리블로그,인기글 치환자

부트스트랩4에 card가 추가됐다. 그리고 며칠 전에 티스토리 블로그에 인기 글을 추가할 수 있게 됐다. 며칠 전까진 불가능했다. 그래서 인기 글을 이 스킨을 추가했는데 세로로 나열되는 것이 마음에 안 들었다. 참고로 티스토리 블로그의 인기 글 치환자에 대해서는 여기를 보면 된다. 그래서 이 글 아래에 카테고리 다른 글이 부트스트랩4의 card를 이용했다. card를 이용하여 가로로 나열하기로 했다. 인기글은 5컬럼이어야 하고 부트스트랩 그리드는 12컬럼이다. 5의 배수가 안 되니 그냥 컬럼을 동일한 폭으로 하기 위해서는 위 그림에 나왔듯 col을 사용하기로 했다. 부트스트랩 4에서 컬럼을 동일하게 하기 위해서 col만 사용하면 된다. 3에서는 없었는데... 이렇게 col만 사용하면 스마트폰에서 컬럼을 ..

2018.11.22

부트스트랩4로 변경하기 포기했다.

내가 알고 있기로 부트스트랩 버전 2부터 출시일을 적자면 위와 같다. 현재 기준 최신 부트스트랩 버전은 4.1.3이다. 그리고 이 블로그는 부트스트랩 4로 만들었다. 내 다른 티스토리 블로그를 부트스트랩 3에서 4로 변경하려고 했지만 포기했다. 위에서 보듯이 버전 2에서 3으로 가는 시간을 오래 걸리지 않았지만 3에서 4로 가는 시간이 5년이라는 기간이 걸렸다. 그래서 내 다른 티스토리 블로그는 부트스트랩 3에 완전히 녹아 들었다. 그리고 3과 4가 많이 달라 변경할 것이 너무 많았다. 부트스트랩 3으로 만들 블로그를 4로 변경하려니 너무 힘들었다. 참고로 내가 부트스트랩 3으로 스킨을 만들었을 때가 2014년이었다. 이 블로그는 부트스트랩 4로 만들었고 다른 티스토리 블로그인 https://min-bl..

2018.11.17

모달에 유튜브 나오게

http://min-blog.tistory.com에서 모달에 유튜브 동영상이 나오게 했다. 이 블로그에서도 스크립트를 설치하여 가능하게 했다. http://min-blog.tistory.com는 부트스트랩3으로 만들었지만 이 블로그에서도 적용 중이다.참고로 이 블로그는 부트스트랩 4이다. 아래 버튼을 클릭하면 영화 안시성과 명당의 메인 예고편 유튜브 동영상이 모달에 나올 것이다. 안시성 명당 모달은 부트스트랩이라 부트스트랩3이나 4가 필요하다. 위에서 http://min-blog.tistory.com이 부트스트랩 3으로 이 모달을 사용했다. 그리고 유튜브만 아니라 비메오도 가능하다. 유튜브나 비메오 동영상이 모달에 나오게 하는 것을 아래에서 배울 수 있다. 참고로 동영상만 아니고 이미지도 가능하다. ht..

2018.09.20

부트스트랩,익스플로러 반응형 처리

익스플로러 7,8에서는 반응형이 안 된다. 그래서 부트스트랩은 익스플로러 7,8에서 반응형이 가능하도록 하기 위해서 아래처럼 하고 있다. 아래 코드에서 IE9(익스플로러 9)보다 작으면 html5shiv.js와 respond.js를 처리하고도록 하고 있다. 여기에서 html5shiv.js는 html5에 해당하는 것이고 respond.js가 반응형에 관계된 것이다. 그러면 영어인 http://getbootstrap.com/를 익스플로러 7,8로 보면 반응형이 된다는 것을 알 수 있다. 그러면 티스토리도 반응형을 만들 수 있으니 티스토리도 익스플로러 7,8에서 반응형이 돼야 할 것이 맞아야 할 것이다. 그러나 이것 때문에 며칠 동안 고생하다 알았는데 티스토리에서 respond.js가 안 먹히므로 반응형이 안..

2015.02.04

부트스트랩 아이콘이 나오게 했다.

이 블로그에 사용한 등 아이콘이 크롬과 익스플로러에서는 나타났는데 파이어폭스에서는 안 나타나서 아래 그림처럼 최근 부트스트랩의 CDN CSS를 이용했다. 참고로 부트스트랩에서 사용하는 Glyphicons은 여기를 보고 부트스트랩 CDN은 여기를 보기 바란다. 그 다음으로 위에 CSS는 폰트 설정이 "Helvetica Neue",Helvetica,Arial,sans-serif으로 설정됐으니 아래처럼 설정했다. CSS에서 우선순위는 인라인 CSS,style,link순이니 폰트를 로 정의하면 될 것 같아 아래와 같이 html에 폰트를 설정했다.

2013.12.26

반응형 핀보드 블로그만들기 어렵다10

반응형이 아닌 고정된 레이아웃으로 반응형으로 만드는 것은 Yongzz님의 노하우를 보고 http://wred-test.tistory.com/처럼 핀보드 형태로 블로그를 만들었다, 그러나 반응형으로 핀보드 형식으로 만들려고 하니 힘들다. 이때 만드는 것은 고정 형태가 아니라 유동 형태의 반응형이라는 것이다. 반응형이라면 어떤 기기에서든 변함이 없어야 하는데...내가 말하는 것은 브라우저의 가로크기를 조절해도 항상 일정한 아래 같은 그림의 것을 말하는 비슷한 것을 말하는 것이다. 이런 것을 실제로 보고 싶다면 여기를 보기 바란다. 이미 해본 고정형을 말하는 것이 아니다.

2013.10.27

부트스트랩의 그리드 시스템이 헷갈린다.

부트스트랩3에서 그리드 시스템에 헷갈린다. 그래서 어떤때는 템플릿을 보고 무작정 그리드를 쓰거나 내가 이해하는 col-md-*만을 쓴다. 이 블로그도 col-md-*로 그리드를 사용하고 있다. .col-xs-,.col-sm-,.col-lg- 는 봐도 모르니 그냥 이해가 편한 col-md-만 사용하고 나머지는 템블릿을 본다. 참고로 아래 그림의 부트스트랩은 12칼럼인데 이 블로그는 10칼럼으로 하는데 언제 변경될지 모른다.부트스트랩3 그리드에 대한 설명(영어) : http://getbootstrap.com/css/#grid 부트스트랩 3의 그리드시스템을 좋은 것 같은데....헷갈리니 아쉽다.

2013.10.26

부트스트랩을 쓰니 간단하네

아래 접혔다 펴지는 것이나 3개의 댓글창이 나타나게 하는 탭을 쓴 것은 모두 부트스트랩((Bootstrap)에 있는 기능으로 했는데 정말 쉽다. 그냥 부트스트랩에 있는 설명대로만 하니 간단히 만들어지네. 그러나 http://min-blog.tistory.com에서 jQuery 플로그인으로 많이 구현했던 것에 비하면 너무 단순하게 금방 싫증날 것 같다는 생각이 든다. 생각외에 부트스트랩에는 유용한 기능이 많이 있으니 시간이 있으면 부트스트랩을 더 많이 알아 다양한 옵션을 많이 연구해야겠다. 남들과 똑같으면 금방 싫증날 것 같다는 생각이 들기 때문이다.

2013.10.07

부트스트랩 3으로 변경했다.2

전에는 이 블로그를 부트스트랩(Bootstrap) 2.3.2로 만들었는데 이번에 부트스트랩 3으로 완전히 변경했다. 3이 나온지 한참됐고 2.3.2를 계속 사용하기가 그랬다. 아직 부트스트랩에 대해 모르는게 많지만... 부트스트랩 3 내려받기와 설명 : http://getbootstrap.com/

2013.10.06

블로그를 반응형으로 만들었다2

이 티스토리 블로그를 부트스트랩(Bootstrap)을 사용하여 반응형으로 만들었는데 아직 많이 부족합니다. 익스플로러가 아닌 크롬,사파리 등 최신 브라우저에서 브라우저의 가로폭을 줄여보세요. 그럼 레이아웃이 해상도에 창에 맞게 변할 것입니다. 이런 것이 반응형 웹이라는 것을 이해하기 바랍니다. 아직 부트스트랩에 대한 것에 많이 모르니 이상한 것이나 부족한 점이 있으면 가르쳐주기 바랍니다. http://min-blog.tistroy.com을 만들었을 때도 완전 허접했는데 여기도 많은 업데이트가 있으면 많은 발전이 있을 것입니다. 무엇보다도 반응형 기초를 위한 기반을 것에 만족합니다. 거창한 계획에 시작도 못하는 것보다는...

2013.09.07

부트스트랩에 있는 Carousel을 어떻게 활용할지...1

아래는 내가 골치아프게 jQuery 등을 쓴 것이 아니라 이 스킨을 만들 때 부트스트랩을 썼다. 아래는 Carousel인데 부트스트랩에 기본적으로 있는 기능이다. 그러니 소스에 대해 묻지 말기 바란다. 그런데 아래는 멋있는데 어떻게 아래를 활용해야 할지 모르겠다. 커스텀 설정없이 스킨만 설치하면 간단히 해결하도록 하고 싶은데 생각이 안난다.부트스트랩 Carousel 부분 : http://getbootstrap.com/javascript/#carousel 외돌개 서귀포에 있는 외돌개라는 것으로 설명은 검색에서 외돌개라고 쳐서 외돌개의 설명을 보기 바란다....MORE 제주월드컵경기장 신서귀포에 위치한 제주월드컵 경기장이다....MORE 소정방폭포 정방폭포가 아니라 작은 정방폭포인 소정방폭포로 높이가 보통 ..

2012.11.16