CreativeCleanDesign

About me Contact
Total
10,372
Today
41
Yesterday
103

Blog


부트스트랩(bootstrap)에 대해서..



웹사이트 제작을 하시거나, 관심이 있으신 분들은 한번쯤 들어 봤던 부트스트랩(Bootstrap)에 대해 들어 보셨을 겁니다. 

기존의 웹사이트를 제작 하시기에 예전에는 html, css 를 통해 직접 날코딩을 해야 합니다. 


트위터 에서 개발된 부트스트랩(bootstrap)은 번거로운 html, css 의 날코딩을 줄여주기 위해 태어 났습니다. 

일종의 웹제작을 쉽게 할 수 있도록 만들어진 프레임 워크 하고 보시면 됩니다. 



부트스트랩의 장점


- 다양한 라이브러리를 포함하여, 사용하기 위한 아이템의 소스를 가져다 쓰면 됩니다.

- 모바일 기준의 UI 프레임워크로 만들어져, 다양한 플랫폼에 최적화 된 사이트를 만들기 쉽습니다.

- 반응형 웹 사이트에 대해 모르는 사람들도 반응형 웹을 만들 수 있을 만큼 사용하기 쉽습니다.


위 내용 처럼 부트스트랩(bootstrap)을 쉽게 사용 할 수 있는것이 포인트 입니다. 

그렇지만, html, css 를 아예 모르면 아무리 쉽게 접근 할 수 있다고 해도, 웹 제작에 대한 기본은 알아야 가능 합니다. 



부트스트랩에서 모바일에 최적화 되도록 하는 코드가 있는데, 이를 뷰포트 메타태그 (viewport) 라고 합니다. 

사용 방법은 아래 코드와 같습니다. 


<meta name="viewport" content="width-device-width, initial-scale=1, maximum-scale=1, user-scalable=no">


위 코드와 미디어쿼리를 사용 하면, 모바일웹에 최적화 된 사이트를 제작 할 수 있습니다. 


부트스트랩을 사용한 사이트들도 많이 있습니다. 






(이미지 출저 : shapebootstrap.net 테마 디자인)


기본의 프레임워크를 사용해서 위 사이트테마들 처럼 디자인을 할 수 있답니다.




저작자 표시
신고
크리에이티브 커먼즈 라이선스
Creative Commons License

'웹관련 IT > 부트스트랩' 카테고리의 다른 글

부트스트랩(bootstrap)에 대해서..  (0) 2016.12.14