부트스트랩 반응형 웹 레이아웃

• 장1 부트스트랩.
• 1-1 사용자 인터페이스 및 상호 작용 아키텍처
• 1-2 부트스트랩 다운로드
• 1-3 포함된 파일
• 1-4 웹페이지에서 부트스트랩 사용하기
• 1-5 공들여 나열한 것
• 1-6 중첩된 레이아웃 및 흐르는 레이아웃
• 1-7 반응형 레이아웃
• 1-8 기존 고정 너비 레이아웃을 반응형 레이아웃으로 변환
• 1-9 반응형 레이아웃을 위한 유틸리티 클래스
• 1-10 일반적인 태그 및 스타일
• 1-11 목록
• 1-12 암호
• 1-13 구글 프리티파이
• 1-14 시트
• 1-15 형태
• 1-16 텍스트 상자의 접두사 및 접미사
• 1-17 단일 버튼
• 1-18 체크박스
• 1-19 목록 선택
• 1-20 양식 레이아웃
• 1-21 단추
• 1-22 버튼 그룹
• 1-23 드롭다운 메뉴가 있는 버튼
• 1-24 탐색 메뉴
• 1-25 탐색 메뉴의 드롭다운 메뉴
• 1-26 탐색 메뉴의 반응형 디자인
• 1-27 탭 #1
• 1-28 탭 #2
• 1-29 탐색 경로 및 페이지네이터
• 1-30 프롬프트 메시지
• 1-31 미리보기 이미지
• 1-32 대화 상자
• 1-33 툴팁
• 1-34 콘텐츠 접기
• 1-35 회전목마
• 장2 반응형 웹 디자인
• 2-1 코스소개
• 2-2 반응형 디자인의 실제 사례
• 2-3 뷰포트 - 뷰포트
• 2-4 뷰포트를 수동으로 구성
• 2-5 픽셀 밀도
• 2-6 미디어 쿼리를 적용하는 방법
• 2-7 미디어 유형 미디어 유형
• 2-8 meida 기능 미디어 기능
• 2-9 시각적 창 너비와 높이의 종횡비
• 2-10 가로세로비 장치의 너비와 높이의 비율입니다.
• 2-11 방향 장치의 사용 방향
• 2-12 높이(시각적 창 높이) 및 장치 높이(장치 높이)
• 2-13 width(시각적 창 너비) 및 device-width(장치 너비)
• 2-14 해상도 픽셀 밀도
• 2-15 연산자 - 및
• 2-16 쉼표로 구분된 여러 미디어 쿼리에 참여
• 2-17 운영자 - 아니
• 2-18 반응형 레이아웃 #1
• 2-19 반응형 레이아웃 #2
• 2-20 반응형 레이아웃 #3
• 2-21 반응형 탐색
• 2-22 탐색 메뉴용 HTML
• 2-23 탐색 메뉴용 CSS
• 2-24 토글 버튼 스타일
• 2-25 반응형 탐색 메뉴 스타일
• 2-26 반응형 이미지
• 2-27 반응형 배경 이미지
• 2-28 다양한 크기의 기기에서는 다양한 이미지를 사용합니다.
• 2-29 다양한 크기의 기기에 다양한 배경 이미지 사용
• 2-30 화면 밀도에 따라 다양한 배경 이미지 전환
• 2-31 그림 채우기
• 2-32 반응형 슬라이드쇼
• 2-33 슬라이드 제어 버튼
• 2-34 슬라이드 제어 버튼 스타일
• 2-35 슬라이드를 덮어쓰는 문제 수정
• 2-36 결론