Bootstrap - [Utilities] - Utilities, 색상, 배경색, .d-block, .d-*-block
Chap.3 Bootstrap4[Utilities] - Utilities, 배경색, .d-block, .d-*-block Bootstrap4 Utilities Utilities, 색상, 배경색, .d-block, .d-*-block Bootstrap4 Utilities .border, .boarder-*-* .border- .rounded, .rounded-* .clearfix, .float-left, .float-right Float left Float right .mx-auto : 중앙 정렬 Centered .w-25, .w-50, .w-75, .w-100, .mw-100 Width 25% Width 50% Width 75% Width 100% Max Width 100% .h-25, .h-50, .h..
2020. 8. 10.
Bootstrap - [주요 화면 구성] - Navs, Navbar, Card, Form
Chap.3 Bootstrap4[주요 화면 구성] - Navs, Navbar, Card, Form Bootstrap4[주요 화면 구성] Navs, Navbar, Card, Form Navs .nav, .nav-item, .nav-link Link Link Link Disabled .ustify-content-center, .ustify-content-end : 정렬 .flex-column Link Link Link Disabled .nav-tabs, .active Active Link Link Disabled .nav-pills Active Link Link Disabled .nav-justified : 균등 분할 .. .. Navbar 반응형 .navbar, .navbar-expand-sm - navb..
2020. 8. 8.
Bootstrap - [활용] - Jumbotron, Alert, Button, Button Group, Badges, Progress Bar, Pagination
Chap.3 Bootstrap4[활용] - Jumbotron, Alert, Button, Button Group, Badges, Progress Bar, Pagination Bootstrap4[활용] Jumbotron, Alert, Button, Button Group, Badges, Progress Bar, Pagination Jumbotron .jumbotron, jumbotron-fluid 이미지 위 글씨 Bootstrap Tutorial Bootstrap is the most popular HTML, CSS... Bootstrap Tutorial Bootstrap is the most popular HTML, CSS... Alert .alert - .alert-success - .alert-inf..
2020. 8. 8.
Bootstrap - [기초] - Bootstrap4, Grid System, Text, Typography, 테이블, 이미지
Chap.3 Bootstrap4[기초] - Bootstrap4, Grid System, Text, Typography, 테이블, 이미지 Bootstrap4[기초] Bootstrap4, Grid System, Text, Typography, 테이블, 이미지 Bootstrap4 CDN 다운로드 없이 링크로 외부에 있는 CSS파일 포함. HTML 템플릿 확장팩 Bootstrap4, Font 설치 파일 > 폴더 열기 > BT4 > ex.01.html > b4-$ 입력시 기본템플릿 Container - .container ▪ 반응 형 고정 너비 컨테이너를 제공 (중앙) - .container-fluid ▪ 뷰포트의 전체 너비에 걸쳐 전체 너비 컨테이너를 제공 My First Bootstrap Page This i..
2020. 8. 8.
CSS - [CSS3 속성] - CSS3 단위, 키워드 단위, 크기 단위, 색상 단위, URL 단위, 박스 속성, display 속성, 배경 속성, font속성, text속성, 위치 속성, float속성, 그림자 속성
Chap.2 CSS3[CSS3 속성] - CSS3 단위, 키워드 단위, 크기 단위, 색상 단위, URL 단위, 박스 속성, display 속성, 배경 속성, font속성, text속성, 위치 속성, float속성, 그림자 속성 CSS3 속성 CSS3 단위, 키워드 단위, 크기 단위, 색상 단위, URL 단위, 박스 속성, display 속성, 배경 속성, font속성 CSS3 단위 CSS3 단위 - 키워드 - 크기 - 색상 - URL 키워드 단위 키워드를 스타일 값으로 입력 - big, middle, small 등 → 키워드에 해당하는 스타일이 자동으로 적용 통합 개발 환경에서는 입력한 속성에 속한 키워드를 자동으로 알려줌 크기 단위 크기 단위 - CSS3에서 가장 많이 사용하는 단위 - %, em, m..
2020. 7. 30.
CSS - [CSS3 선택자] - 선택자 개요, 기본 선택자, 속성 선택자, 후손 선택자, 자손 선택자, 반응 선택자, 상태 선택자, 구조 선택자
Chap.2 CSS3[CSS3 선택자] - 선택자 개요, 기본 선택자, 속성 선택자, 후손 선택자, 자손 선택자, 반응 선택자, 상태 선택자, 구조 선택자 CSS3 선택자 선택자 개요, 기본 선택자, 속성 선택자, 후손 선택자, 자손 선택자, 반응 선택자, 상태 선택자, 구조 선택자 선택자 개요 CSS3 선택자 - 특정한 HTML 태그를 선택할 때 사용하는 기능 - 선택한 태그에 원하는 스타일이나 스크립트 적용 가능 CSS 블록 - style 태그 내부에 입력 스타일시트 - style 태그 내부에 입력하는 코드 CSS3 선택자 기본 선택자 기본 선택자 전체 선택자 적용하기 - default_wildcard.html - 모든 태그의 color 스타일 속성을 red로 변경 제목 글자 태그 Lorem ipsu..
2020. 7. 30.
HTML - [HTML5 기본 태그] - 제목 글자 태그, 본문 태그, 하이퍼링크 태그, 글자 모양 태그, 목록 태그, 테이블 태그, 이미지 태그, 기본 공간 분할 태그, 시맨틱 태그, 입력 양식 태그
Chap.1 HTML[HTML5 기본 태그] - 제목 글자 태그, 본문 태그, 하이퍼링크 태그, 글자 모양 태그, 목록 태그, 테이블 태그, 이미지 태그, 기본 공간 분할 태그, 시맨틱 태그, 입력 양식 태그 HTML5 기본 태그 제목 글자 태그, 본문 태그, 하이퍼링크 태그, 글자 모양 태그, 목록 태그, 테이블 태그, 이미지 태그, 기본 공간 분할 태그, 시맨틱 태그, 입력 양식 태그 제목 글자 태그 제목 글자 태그 - 문서의 제목을 표현할 때 사용 - h : Heading을 의미 text_header.html 제목 글자 태그 1 제목 글자 태그 2 제목 글자 태그 3 제목 글자 태그 4 제목 글자 태그 5 제목 글자 태그 6 결과 특수문자 표기 - 연속된 공백을 모두 표시하려면 사용 - 외에 다음과..
2020. 7. 30.
SQL - 인덱스 - 인덱스, B-Tree, 인덱스 만들기, 인덱스 삭제
Chap.9 인덱스 - 인덱스, B-Tree, 인덱스 만들기, 인덱스 삭제 인덱스 인덱스, B-Tree, 인덱스 만들기, 인덱스 삭제 인덱스 특정 컬럼을 별도로 정렬하여 검색 속도를 향상 Primary Key, Unique, Foreign Key 컬럼은 자동으로 인덱스가 생성됨 정렬 작업을 하므로 추가 공간 및 처리 시간 비용이 듬 - 추가 수정 작업보다 검색 작업이 많을 때 유리 B-Tree(Balanced Tree, 균형 트리) 인덱스 만들기 [형식] CREATE INDEX 인덱스명 ON 테이블명(컬럼명, …); USE sqlDB; SELECT * FROM userTBL; SHOW INDEX FROM userTBL; SHOW TABLE STATUS LIKE 'userTBL'; CREATE INDEX ..
2020. 7. 29.
SQL - 테이블과 뷰[뷰] - 뷰(View), 뷰 만들기, 뷰 삭제
Chap.8 테이블과 뷰[뷰] - 뷰(View), 뷰 만들기, 뷰 삭제 뷰 뷰(View), 뷰 만들기, 뷰 삭제 현재 tableDB.userTBL 현재 tableDB.buyTBL 뷰(View) 테이블과 동일하게 사용되는 개체 SELECT 쿼리 결과를 하나의 테이블로 간주 - 여기에 이름을 배정하고 이를 통해 사용 [형식] CREATE VIEW 뷰이름 AS SELECT 쿼리 뷰 만들기 USE tableDB; CREATE VIEW v_userTBL AS SELECT userid, name, addr FROM userTBL; SELECT * FROM v_userTBL; -- 뷰를 테이블이라고 생각해도 무방 결과 SELECT U.userid, U.name, B.prodName, U.addr, CONCAT(U.m..
2020. 7. 29.
