IT업계 종사자의 블로그

[Project H4C] 7. HTML5 시작 HTML5 HTML 언어의 최신 표준 권고안 HTML5 문서의 기본 구조 HTML5에서 추가된 요소 및 타입 semantic 요소: , , , , , , , multimedia 요소: , graphic 요소: , input 요소의 타입: number, date, time, calendar, range HTML5에서 추가된 자바스크립트 API - Geolocation - Drag and Drop - Web Storage - Application Cache - Web Worker - Sever Sent Events 그 외 HTML5에서 추가된 요소들 http://tcpschool.com/html/html5_intro_addition 코딩교육 티씨피스쿨 4차산업혁..

[Project H4C] 6. HTML 확장 CSS란? Cascading Style Sheets의 약자. 연속된 스타일 시트... 뭐 대충 이런 뜻 같다. 오늘날 대부분의 웹 브라우저들이 CSS를 지원하고 있다. CSS 적용 방법은 인라인 스타일, 내부 스타일 시트, 외부 스타일 시트가 있다. 인라인 스타일 HTML 요소 내부에 style 속성을 사용하여 CSS 스타일을 적용하는 방법 인라인 스타일은 해당 요소에만 스타일을 적용할 수 있다. e.g.) 인라인 스타일 내부 스타일 시트 HTML 문서의 태그 내에 외부 스타일 시트 웹 사이트 전체의 스타일을 하나의 파일에서 변경하는 방법 스타일을 적용할 모든 웹 페이지의 태그 내에 태그를 사용하여 외부 스타일 시트를 포함한다. e.g.) 스타일 적용 우선 순..

[Project H4C] 5. HTML 입력 양식 form 사용자로부터 입력을 받거나, 사용자가 입력한 데이터를 서버에 보낼 때 사용 action 속성: 입력받은 데이터를 처리할 서버 상의 스크립트 파일의 주소를 명시 이렇게 전달받은 데이터를 처리하는 스크립트 파일을 form-handler 라고 한다. method 속성: 입력받은 데이터를 서버에 전달할 방식을 명시 => 사용자가 form 요소를 통해 입력한 데이터는 action 속성에 명시된 위치로 method 속성의 방식을 통해 전달된다. method 속성 method 속성을 통해 명시할 수 있는 form 요소의 전달 방식은 GET or POST 방식이다. GET: 주소에 데이터를 추가하여 전달하는 방식 데이터가 주소 입력창에 그대로 나타나며, 전송할..

[Project H4C] 4. HTML 공간 분할 HTML 의 모든 요소는 display속성(웹 브라우저에 어떻게 보이는가를 결정)을 가진다. display 속성에는 블록(block)과 인라인(inline)이 있다. 블록(block) display 속성값이 블록인 속성들은 언제나 새로운 라인에서 시작한다. 해당 라인의 모든 너비를 차지한다. e.g.) p요소는 display 속성값이 블록이다 display 속성값이 블록(block)인 요소 : , , , , , 다른 HTML 요소들을 하나로 묶는 데 자주 쓴다. 주로 다른 요소들의 스타일을 한 번에 적용하기 위해 사용한다. e.g.) div요소 이렇게 div요소로 여러 요소들을 묶은 다음에 style 속성과 클래스 등을 이용하여 한 번에 스타일을 적용할 ..

[Project H4C] 3. HTML 기본 요소 스타일 style 속성을 이용한 방법은 단 하나의 HTML 요소에만 적용된다. e.g.) text 텍스트 text 텍스트 text 텍스트 text 텍스트 여러가지 스타일 설정 e.g.) 속성값 사이에 세미콜론(;)을 넣어 구분한다. CSS 속성을 하나만 사용할 때, 여러개의 CSS 속성 중 마지막 속성은 세이콜론을 생략할 수 있다. 색상 1. W3C에서 정의한 HTML4 표준 색상 이름 aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, yellow (e.g. 청록색 ) 2. RGB 색상값: Red, Green, Blue (e..

[Project H4C] 2. HTML 텍스트 요소 제목 HTML에서 제목은 ... ~ ... 태그로 표현할 수 있다. 태그는 많은 검색엔진에서 키워드로 수집되는 태그이다. HTML 문서의 제목에는 , 태그를 사용하지 않는다. 종료 태그 반드시 쓰기! 단락 HTML에서 단락은 로 나타낸다. 텍스트를 다음 줄에 나타내고 싶으면 태그(break line)를 사용한다. ( 태그는 종료태그가 없는 빈 태그다) 코딩으로 작성한 문장표현(줄바꾸기, 띄어쓰기 등)을 그대로 브라우저에 나타내고 싶으면태그를 쓴다. 수평 가로 구분선을 넣을때는 태그를 사용한다. 서식 글자 진하게: , (은 내용이 중요하다는 뜻도 포함됨) 이탤릭체: , (은 내용이 중요하다는 뜻도 포함됨) 하이라이팅: 중간 가로줄: 밑줄: 위첨자: 아래첨..

[Project H4C] 1. HTML 시작 HTML이란? HTML은 Hyper Text Markup Language의 약자로, 웹페이지를 만들고 구성하는 언어이다. HTML 표현 방법 HTML은 태그 이름의 처음과 끝을 꺾쇠 괄호를 감싼다 (e.g. , , ) 종료 태그가 없는 HTML 태그도 있는데 빈 태그라고 한다.(e.g. , , ) 현재는 2014년에 발매한 HTML 5가 최신 버전이다 (2020년 7월기준) HTML의 기본 구조 : 현재 HTML5 버전인것을 의미한다. : 문서의 root요소를 정의한다. 안에 들어갈 수 있다. : HTML문서의 제목역할을 하며 웹브라우저의 툴바, 웹브라우저의 즐겨찾기 제목, 검색엔진의 결과 페이지에 뜨는 내용이다. : HTML문서의 몸통 부분이며 웹브라우저에 ..

[Project H4C] 맥북(MacBook)에서 버추얼박스(Virtual Box) 설치 후 우분투(Ubuntu) 깔기 (마지막편) 여기서 멈춰버린 보안계신생아의 발걸음........ 사실 여기서 멘토분들한테 물어볼까..이 생각도 했지만 첫 과제는 스스로 하고 싶다는 생각이 커서 정말 정말 물어보고 싶었지만.... 꾹 참아가며😭 혼자 써칭하면서 별의별 생각을 해봤다. (재부팅과 재세팅과 프로그램 설치, 제거를 몇 번을 했던지....ㅋㅋㅋㅋㅋ.....흑ㅠ) 자, 차근차근 다시 처음부터 생각해보자. 그때 스쳐 지나가는 나의 첫 번째 에러창 (1편 참고) 그래.. 애당초 버박을 잘못 깔았던 거야........ 이게 내 결론이다.(feat. 곽철용) 그래서 아예 싹 다 지우고 다시 처음부터 다시 시작하기로 했다..

[Project H4C] 맥북(MacBook)에서 버추얼박스(Virtual Box) 설치 후 우분투(Ubuntu) 깔기 (3편) 1편 https://dope-pd.tistory.com/2 2편 https://dope-pd.tistory.com/3 장담컨대 버추얼박스 깔고 우분투 설치하는 내용으로 블로그 3개 이상 쓰는 사람은 이번 스터디그룹에서 나 밖에 없을 것 같다...........😭😭😭😭😭😭 근데 문제는 이 주제로 한 4편까지 나올 것 같단 말이지...그만큼 나에게 참 긴 여정이었다...... 하여튼! 아침에 일어나자마자 우분투 파일 다 받아졌는지 확인했다 다운 다 받은 걸 확인하고 출근길에 나서는 4대 보험 가입자 (총총총) 두 번째 날은 퇴근 후 더 똥줄이 타기 시작했다. 첫날이면 다 끝날 줄..

[Project H4C] 맥북(MacBook)에서 버추얼박스(Virtual Box) 설치 후 우분투(Ubuntu) 깔기 (2편) 1편에서 이어집니다. 안 보신 분들은 보고 오시길....💙 https://dope-pd.tistory.com/2 [Project H4C] 맥북(MacBook)에서 버추얼박스(Virtual Box)설치 후 우분투(Ubuntu)깔기 [Project H4C] 맥북(MacBook)에서 버추얼박스(Virtual Box) 설치 후 우분투(Ubuntu) 깔기 대망의 Project H4C 첫 과제 우선 공통과제 1. 버추얼박스 구글링해서 설치하기 2. 버추얼박스 안에 리눅스 OS인 Ubuntu.. dope-pd.tistory.com 그렇게 우여곡절 끝에 버추얼박스를 깔긴 깔았다. 자, 이제 ..