오봉이와 함께하는 개발 블로그

FrontEnd_day4 정리 (2021.12.07 화요일) Bootstrap 주요 기능 Containers (Bootstrap - 적용방법, Container에 올림) Jumbotron Grid button Table Image Jumbotron 일종의 대형 전광판 특정 컨텐츠나 관심있는 정보를 눈에 띄게 보여주기 위한 큰 박스 점보트론 예제 : jumbotron.html Jumbotron 둥근 모서리 사각형 영역 Jumbotron container 밖에 있는 jumbotron Jumbotron container 밖에 있는 jumbotron jumbotron-fluid : 각진 모서리 점보트론 예제 : jumbotron2.html 안녕하세요 처음 뵙겠습니다. 저는 개발자가 되고 싶은 고병채라고 합니다 ..

FrontEnd_day3 정리 (2021.12.06 월요일) Bootstrap HTML, CSS, JS 라이브러리 jQuery 기반의 HTM5 Web Framework 프론트엔드에서 작동되는 프레임워크 트위터에서 사용하던 각종 레이아웃, 버튼, 입력 요소 등 UI 요소들을 누구나 사용할 수 있도록 만들어진 오픈 소스 프레임 워크 (라이브러리) HTML/CSS 기반의 템플릿 양식, 버튼, 내비게이션 등 다양한 UI 요소 포함 자바스크립트를 선택적으로 확장 가능 Bootstrap 특징 쉽고 편리하게 사용할 수 있음 HTML/CSS 기본 지식만 있으면 누구나 사용 가능 반응형 웹 디자인 PC 또는 스마트폰이나 태블릿 등의 모바일용 디자인 지원 모든 최신 브라우저와 호환 Bootstrap 기능 CSS 기능 : ..

FrontEnd_day3 정리 (2021.12.06 월요일) 반응형 웹 PC, TV, 내비게이션, 스마트 기기 등 다양한 기기의 화면이나 환경에 맞게 자유자재로 변하도록 만들어진 웹 반응형 웹의 장점 유지보수 간편 모바일 버전과 데스크 탑 버전 두개의 웹사이트를 만들게 되면 웹 사이트 수정/갱신할 때 모바일 버전과 데스크탑 버전을 개별적으로 수정해야 하므로 업무량이 늘어나고 작업 내용도 복잡 모바일 버전, 태블릿 버전, 데스크탑 버전 등 모든 디자인을 하나의 HTML과 CSS 파일에서 작업하기 때문에 유지보수 용이 마케팅에 유리 환경이나 기기에 따라 최적화된 구조로 웹사이트를 변경해서 보여줄 수 있기 때문에 확실하게 내용 전달 가능 비용면에서 효과적 두 가지 버전의 웹 사이트를 만들지 않아도 되기 때문에..

FrontEnd_day3 정리 (2021.12.06 월요일) CSS 예제 cssEx1.html(테이블 사용) 패션잡화 주방용품 생활건강 DIY가구 캐주얼화 스니커즈 미니크로스 여성 가방 페이퍼플레인 겨울 신발 35,000원 20,000원 25,800원 공지사항 [배송] : 무료배송 변경 안내 2021.08.25 [전시] : DIY 가구 전시 안내 2021.09.01 [판매] : 11월 특가 상품 안내 2021.11.01 커뮤니티 [레시피] : 살 안찌는 야식 만들기 [가구] : 헌집 새집 베스트 가구 [후기] : 배송이 잘못 됐어요 ㅠㅠ cssEx1.css(테이블 사용) @charset "UTF-8"; #wrap { margin:0 auto; /* 내가 가운데 정렬 */ width:800px; /* 가운..

FrontEnd_day2 정리 (2021.12.03 금요일) CSS 파일로 HTML 문서 외부에 정의 CSS 파일 인코딩 UTF-8 CSS 파일 생성 HTML :