부트스트랩은 자체적으로 폰트를 사용합니다. 그런데 특정할 수 없는 상황에서 다음과 같은 에러가 발생합니다. 흠.... 파일경로로가보면 파일을 정상적으로 있는데 파일을 못 는 현상이 있습니다. 어디선가 많이 보던 에러인데..... stackoverflow - How to remove error about glyphicons-halflings-regular.woff2 not found 아..... 원인은 간단합니다. '.woff2'라는 확장자는 'MIME'기본 설정에 들어 있지 안씁니다 ㅋㅋㅋㅋㅋ 1. IIS의 경우IIS에서 MIME를 추가하면 됩니다. 사이트에 'MIME 형식'에 들어가서 '추가'를 눌러 아래와 같이 내용을 넣어주고 '확인'을 눌러 줍니다. 파일 이름 확장명 : .woff2 MIME 형식 ..
아무런 플러그인을 적용하지 않았다면 기본적인 자바스크립트로 'add'하거나 제이쿼리(JQuery)의 'append'를 이용하여 추가 할 수 있죠. 문제는 'Bootstrap-select'를 이용하면 되지 않는다는 것이죠 ㅎㅎㅎ 1. 레퍼런스(reference) 확인 뭔가 이상해서 레퍼런스를 확인해 봤습니다. (참고 : silviomoreto - bootstrap-select ) 아.... '부트스트랩-셀랙트'를 사용할 때 옵션이 변경되면 'refresh'를 호출하여 UI에 반영할 수 있다고 설명되어 있습니다. 2. 테스트해 보기 '부트스트랩-셀랙트'의 샘플이 잘돼 있어서 제가 따로 만들 필요가 없을 것 같긴 한데 한번 만들어 봅시다. 2-1. HTML 작성하기 이전에 작성했던 포스트에서 'select'태..
기본 부트스트랩에는 태그에 대한 스타일 시트나 자바스크립트가 없습니다. 그런데 다행히도 누군가 만들어 둔것이 있군요 ㅎㅎ 1. Bootstrap-select 'Bootstrap-select'라는 프로젝트입니다. 부트스트랩을 사용할때 태그의 디자인과 기능을 확장해줍니다. (참고 : silviomoreto - bootstrap-select ) 1-1. 설치 설치는 간단합니다. 다운로드 받은 파일중 'bootstrap-select.min.js'와 'bootstrap-select.min.css'를 원하는 위치에 넣고 웹페이지에서 임포트 해줍니다. (위치는 제이쿼리 위에 부트스트랩 아래 위치하는게 좋을듯 하네요.) 1-2. 추가 코드 그냥 이상태로 넣고 사용하면 아무런 동작을 하지 않습니다-_-;;; 결국 셈플을..
웹디자인의 이슈 중 하나가 반응형 디자인입니다. 반응형 디자인이라는 건 해상도가 변해도 다른 작업 없이 레이아웃이 구성되도록 하는 것을 말합니다. (유동 디자인, 능동형 디자인 등으로 부릅니다.) 해상도에 따라 다른 화면이 아닌 일정한 화면을 보여주는 방식으로 크로스 브라우징을 해결하려고 하는 생각은 이전부터 있었습니다. 그런데 이 방법의 가장 큰 문제는 한가지 스타일만 가지고는 이 문제를 해결할 수 없다는 점입니다. 그래서 생겨난 것이 '@media'인데.... 미리 정의한 타입들만 가지고는 한계가 있다는 문제점이 있습니다. (참고 : sixmen - Media Query ) 그래서 CSS3에서는 미디어 쿼리라는 것이 생겼습니다. 1. 문제의 시작 특정 범위의 해상도에서는 한가지 스타일만 가지고 있어도..