본문 바로가기

HTML39

Bootstrap | 강의 | 03 - 버튼을 달고 전체 폭을 조종 / Button / container 1. 이번 시간에는 - 게시판이 생겼으니 "글쓰기"와 같은 버튼이 필요하겠죠? - 그리고 좌우로 가득찬 게시판도 좋지만 보통은 좌우에 적당한 폭이 있어 - 한눈에 보기 편한 모양으로 만들어 볼것입니다. - 역시나 이번에도 부트스트랩 매력에 푹 빠져봅시다.! 2. 버튼을 다뤄보자 2.1 버튼을 만들어 보자 ▼ 아래처럼 코딩해보겠습니다. 버튼 버튼 ▼ 화면에 띄워보니 기본 버튼, 부트스트랩 버튼이 보입니다. 딱 봐도 부트스트랩 버튼은 디자인 들어갈 준비가 되어 있네요.이제 디자인을 입혀 봅시다. ▼ 아래 코드를 입력하고 웹으로 봐볼까요? Basic Default Primary Success Info Warning Danger Link Large Medium Small XSmall ▼ 디자인을 보는 직관적인 .. 2017. 7. 2.
Bootstrap | 강의 | 02 - 게시판 모양을 만들어 보자! / 테이블 / 페이징 1. 깔끔한 게시판 모양을 한방에! 부트스트랩 매력 느껴보자! - 홈페이지를 꾸미려다가 CSS와 HTML을 작성하다. 포기해버린 경험들이 있으실 겁니다. (저부터..) - 기본 뼈대는 나와도 디자인 입힐려면 디자이너 퍼블리셔가 아닌 이상 고역일거고 정작 프로그램 공부가 뒷전 입니다. - 이전 강의에서도 말했듯이 부트스트랩은 아주 훌륭한 디자이너와 퍼블리셔가 제공한 CSS입니다. - 이번 강의에서 부트스트랩 매력에 푹 빠져 보시죠!!! 2. 테이블을 만들어 보자! 2.1 Table 이란 - 실무에서 혹은 좋은 강의를 제공하는 곳에서 선행 되신분들은 보단 태그가 많이 활용되는걸 알고 있을 겁니다. - 데이터를 FM으로 나타내는 요소는 이므로 두번째 시간이니 부트 스트랩으로 이쁜 을 만들어 보는 시간을 가지겠.. 2017. 7. 2.
Bootstrap | 강의 | 01 - 부트스트랩 이란? / 설치 / 다운로드 1. 부트스트랩이란 1.1 제작사 http://getbootstrap.com/ (한글 번역 개인사이트 http://bootstrapk.com/) - 부트 스트랩은 트위터에서 개발한 UI 라이브러리 입니다. - 마크 오토(Mark Otto)와 제이콥 손튼(Jacob Thornton)이 개발하였습니다. (둘이 안사귐 게이아님) 1.2 목적 - 모바일 환경에 적합한 반응형 웹을 개발하기 위한 라이브러리 - 디자인으로 인한 개발시간을 단축하기 위한 개발도구 2. 부트스트랩 설치 2.1 설치설명 - 부트스트랩 설치는 압축을 풀기만 하면 됩니다. - 프로젝트 할때 디자인과 퍼블리셔가 css,js 폴더를 만들어주고 나서 개발을 시작할텐데 바로 그 CSS 폴더를 제공해주는 것 입니다. - 웹스톰 같은 IDE를 프로젝트.. 2017. 7. 1.