my code archive
my code archive
article thumbnail
[국비학원 기록/BS] 부트스트랩 그리드 시스템(Grid system), container, row, column

BS 1. BS -부트스트랩(Bootstrap) : 웹 프런트엔드 개발 프레임워크 -트위터에서 웹 디자인을 설계하기 위해 CSS의 클래스 선택자에 정의된 스타일 시트와 자바스크립트 플러그인의 라이브러리 2. BS 핵심 요소 1)CSS 2)Grid system 3)컴포넌트 4)JS 플러그인 그리드 시스템(Grid system) 1. 그리드 시스템 -반응형,유동형 레이아웃을 지원하는 구역 분할 시스템(총 12분할) -Magic Number12 -하나의 요소가 차지할 크기를 1칸에서 12칸까지 설정해줄 수 있음. -하나의 요소가 차지할 크기를 해상도 별로 따로 설정해줄 수 있음. 2. 반응형 웹페이지 -디바이스 장치에서 레이아웃이 달라지는 반응형 웹페이지를 만들 때 기본적으로꼭 포함해야 하는 meta 태그 -..

article thumbnail
[국비학원 기록/html5] CSS 가상 클래스 선택자, 가상 요소 선택자, 속성 선택자

가상 클래스 선택자(Pseudo Classes Selectors) 1)hover -E:hover -E에 마우스(포인터)가 올라가 있는 동안에만 E 선택 2)active -E:active -E를 마우스로 클릭하는 동안에만 E 선택 3)focus -E:focus -E가 포커스된 동안에만 E 선택 4)first-child -E:first-child -E가 형제 요소 중 첫번째 요소라면 선택 5)last-child -E:last-child -E가 형제 요소 중 마지막 요소라면 선택 6)nth-child(n) -E:nth-child -E가 형제 요소 중 n번째 요소라면 선택 7)nth-of-type(n) -E:nth-of-type(n) -E의 타입(태그 이름)과 동일한 타입인 형제 요소 중 E가 n번째 요소라면 ..

article thumbnail
[국비학원 기록/html5] CSS 기본 문법, 선택자

CSS 선택자 1.선택자 1)HTML에 스타일(CSS)을 적용하기 위해 HTML의 특정한 요소를 선택하는 사인(sign). 2) 스타일의 종류(Property) ---- 선택자 { 속성 : 값; } ----- 스타일(CSS)을 적용할 대상(Selector) 선택자 { : 자식 선택자 결과 ul > .orange : ul의 자식 클래스 orange 선택 .orange + li : 클래스 orange의 다음 형제 요소 li 하나 선택 .orange ~ li : 클래스 orange의 다음 형제 요소 li 모두 선택 결과

article thumbnail
[국비학원 기록/html5] HTML 문서 구조, <div>,<h>,<p>,<a>,<span>,<br>,<ul>,<input>,<table>

HTML 문서 구조 1. 1)division, 분할, 문서의 부분이나 섹션 정의 2)단순히 특정 범위를 묶는(wrap) 용도로 사용 -> 특별한 의미가 없는 구분 3)묶인 부분들에 CSS나 JS를 적용 4)블록(상자)요소 2. 1)제목을 의미 2)블록(상자)요소 3)숫자가 작을 수록 더 중요한 제목을 정의 3. 1)문장을 의미 2)블록(상자)요소 4., 1)순서가 필요없는 목룍의 집합 2) -목록 내 각 항목(List Item) 3)블록(상자)요소 5. 1)같은/다른 페이지로 이동하는 하이퍼링크를 지정하는 요소 2)href : 링크 URL target : 링크 URL의 표시(브라우저 탭) 위치 (_blank) 3)인라인(글자)요소 6. 1)특별한 의미가 없는 구분을 위한 요소 2)인라인(글자)요소 7. ..

article thumbnail
[국비학원 기록/html5] HTML 문서, <html></html>,<head></head>,<title></title>,<link></link>,<style></style>

0. 1)문서의 HTML 버전을 지정. 2)DOCTYPE (DTD,Document Type Definition) 3)마크업 언어에서 문서 형식을 정의. 4)웹 브라우저가 어떤 HTML 버전의 해석 방식으로 페이지를 이해하면 되는지를 알려주는 용도. 5)HTML5(표준) 1. 1)문서의 전체 범위 2)HTML 문서가 어디에서 시작하고 어디에서 끝나는지 알려주는 역할. 2. 1)문서의 정보를 나타내는 범위 2)웹 브라우저가 해석해야 할 웹 페이지의 제목,설명,사용할 파일 위치,스타일(CSS)같은 웹 페이지의 보이지 않는 정보를 작성하는 범위 문자 인코딩 방식 --------- 3) ------- HTML 문서(웹페이지)의 제작자,내용,키워드같은 여러 정보를 검색 엔진이나 브라우저에게 제공 3. 1)HTML ..

article thumbnail
[국비학원 기록/html5] HTML 개요, 기본 문법, 인라인(Inline)요소, 블록(Block)요소

1. 웹 기반 프로그램 특징 1)화면과 로직을 서버에서 모두 처리하므로 클라이언트가 특별히 수행할 작업이 없음. 2)모든 기능을 서버에서 처리하므로 보안 면에서도 우수함. 2. 정적(static) 웹 프로그래밍 1)웹 서버(Apache)에 미리 보여줄 HTML 페이지,CSS,이미지,JS(자바스크립트) 파일을 저장해놓고 브라우저에서 요청할 경우 그대로 전달하는 방식. 2)사용자는 페이지가 변경되지 않는 한 고정된 웹 페이지를 보게 함. 3)구성 요소 -웹 서버 : 각 클라이언트에게 서비스를 제공하는 컴퓨터를 의미. -클라이언트 : 네트워크로 서버에 접속한 후 서버로부터 서비스를 제공받는 컴퓨터를 의미. -HTTP(Hyper Text Transfer Protocol) :www 서비스를 제공하는 통신 규약. ..

article thumbnail
[국비학원 기록/자바] 스레드02. 제어 메서드, join(),interrupt(),wait(),notify(),notifyAll()

1. multi-threading 1)여러 thread가 동시에 수행되는 프로그래밍. 여러 작업이 동시에 실행되는 효과. 2)thread는 각각 자신만의 작업 공간을 가진다. -> context 3)각 thread 사이에는 공유하는 자원이 있을 수 있다. (자바에서는 static instance) 4)여러 thread가 자원을 공유하여 작업이 수행되는 경우 (멀티 쓰레드) 서로 자원을 차지하려는 race condition이 발생할 수 있다. 5)이렇게 여러 thread가 공유하는 자원 중 경쟁이 발생하는 부분을 critical section이라 한다. 6)critical section에 대한 동기화를 구현하지 않으면 오류가 발생할 수 있다. 2. 스레드 실행 제어 메서드 1)join( ) -다른 스레드의..

article thumbnail
[국비학원 기록/자바] 쓰레드01. 프로세스, 스레드(Thread)장점, 단점,우선순위

1. 프로세스(process) 1)프로그램 ---------> 프로세스 실행 2)프로그램이 실행되면 OS(Operating System)로부터 메모리를 할당받아 프로세스 상태가 됨. 2)하나의 프로그램이 여러 개의 프로세스를 만들기도 함. 2. 멀티 태스킹(multi tasking) 1)통상 두 가지 이상의 작업을 동시에 처리하는 것을 칭함. 2)구현 방법 -멀티 프로세스 -독립적 프로그램을 여러 번 실행하고 작업을 처리하는 것. -멀티 스레드 -하나의 프로그램을 실행하여 내부적으로 여러 가지 작업을 처리하는 것. ex)카카오톡-채팅 스레드, 파일 전송 스레드 등.... 스레드 3. 스레드(thread) 1)하나의 프로세스는 하나 이상의 thread를 가지게 됨. -하나의 프로세스에 여러 개의 스레드 생..

반응형
반응형