728x90

HTML 6

1. CSS 기초 | CSS 사용법, 선택자와 선언, 태그 선택자, id 선택자, 클래스 선택자

CSS란? Cascading Style Sheets의 약자로, 우선순위가 있는 style sheet HTML이나 XML로 작성된 문서를 효율적으로 디자인하기 위해 등장한 언어 HTML은 본래 문서에 정보를 담기 위한 목적으로 생겨난 언어인데, 각종 디자인을 담당하는 태그가 생겨나기 시작하면서 디자인을 보여주기 위한 문서가 되는 문제가 생겼다. 그래서 HTML의 목적을 유지하고 디자인 기능도 살리기 위해서 디자인 관련 요소를 모아서 만든 CSS가 등장했다. CSS를 사용하는 두 가지 방법 1. head 내부에서 태그를 사용 (oragne) : 해당 태그에 종속 2. 기본 태그 내부 속성으로 style을 사용 (purple) : 그 라인만 적용 Hello World// 방법 2 Hello world 위의 코..

Web/CSS 2021.01.20

5. HTML 웹사이트 만들기 | 하이퍼링크 삽입, a href

/* 윈도우 10에서 Atom 편집기를 사용했습니다. */ 웹사이트 만들기 실제 웹사이트처럼, 클릭하면 해당 내용을 보여주도록 만들어보자! 하이퍼링크 삽입하기 입력문자 위의 코드를 사용하면 하이퍼링크를 삽입할 수 있다. 주소는 실제 웹브라우저 주소 또는 내 컴퓨터에 저장된 html 파일 이름이면 된다. 입력문자는 클릭할 수 있는 문자를 의미한다. [이제 시작이야 디지털 포렌식] 목차 소개 핵심적인 기술 개념 랩과 툴 증거 수집 윈도우 시스템에서의 증거 수집 안티 포렌식 인터넷 주소가 아니라 html 파일을 삽입할 것이므로, 각 목차와 어느 파일을 연결할 것인지 미리 적는다. 쉽게 말하면 html 파일명을 우리가 미리 지정해주는 것이다. 그러므로 항목 파일을 만들 때 목차에 따른 파일명은 위의 코드를 따라..

Web/HTML 2021.01.12

4. HTML 문서 만들기 | html, head, title, body, doctype

/* 윈도우 10에서 Atom 편집기를 사용했습니다. */ HTML 문서를 만들 때는 위의 코드 양식을 따른다. HTML 문서 양식 ▶ ... : html을 사용한 문서임을 알리고, html의 시작과 끝을 알림 ▶ : 본문에 해당되지 않는 태그(문서를 설명하는 태그)를 담는 공간 ▶ ... : 본문을 담는 공간 Penguins King Penguin Aptenodytes patagonicus Emperor Penguin Aptenodytes forsteri Gentoo Penguin Pygoscelis papua Adelie Penguin Pygoscelis adeliae Chinstrap Penguin Pygoscelis antarcticus Southern Rockhopper Penguin Eudyp..

Web/HTML 2021.01.12

3. HTML 목록 만들기 | li, ul, ol

/* 윈도우 10에서 Atom 편집기를 사용했습니다. */ 목록 만들기 소개 핵심적인 기술 개념 랩과 툴 증거 수집 윈도우 시스템에서의 증거 수집 편집기에서 위와 같이 작성해보자. 위의 목차는 내가 가지고 있는 디지털 포렌식 책의 목차이다. 그렇지만 우리가 작성한 코드의 결과는 이렇게 뜬다. HTML은 줄바꿈을 무시한다. 결과에 반영되지 않는다. 소개 핵심적인 기술 개념 랩과 툴 증거 수집 윈도우 시스템에서의 증거 수집 그렇다면, 위의 코드를 작성해보자. 목록을 만들어주는 태그인 ...를 목록을 만들고 싶은 부분 앞뒤에 넣어주자. ...태그가 반영된 모습이다. 소개 핵심적인 기술 개념 랩과 툴 증거 수집 윈도우 시스템에서의 증거 수집 디지털 포렌식 : THE BASICS Java의 정석 초급 스페인어 V..

Web/HTML 2021.01.12

2. HTML 기초 | 아톰(Atom) 기본 사용법, HTML 태그, HTML 공부 방향

/* 윈도우 10에서 Atom 편집기를 사용했습니다. */ 아톰(Atom)에서 파일 작성하는 법 File-Open Folder 선택해서 HTMl 파일을 저장할 폴더 선택해주자 생성된 폴더 우클릭-New File 선택 파일 이름 작성하고 엔터! 생성 완료! HTML 태그 태그란? ...과 같이, 내용의 앞 뒤로 씌워서 변화를 주는 명령어. 태그를 열고, 닫는다고 표현한다. ▶줄바꿈 관련 태그 : break의 약자. 단일 태그(닫는 태그 없음)이고, 태그가 있는 곳에서 한 줄 띄운다. ... : paragraph의 약자. 태그 사이에 있는 내용을 한 문단으로 처리해준다. 마지막 줄로부터 한 칸 띄워진다. 태그와 ...태그의 차이점을 나타내기 위해서 파일을 만들어봤다. 은 그저 '한 줄 띄우기'라는 역할을 다..

Web/HTML 2021.01.11

1. HTML 공부 준비하기 | 아톰(Atom) 설치

웹 개발의 기본! 편집기(Editor) 설치하기 https://atom.io/ A hackable text editor for the 21st Century At GitHub, we’re building the text editor we’ve always wanted: hackable to the core, but approachable on the first day without ever touching a config file. We can’t wait to see what you build with it. atom.io 위의 링크로 들어가서 아톰을 다운받자 본인이 사용하고 있는 운영체제에 맞게 설치해주면 되지롱 오른쪽에 뜨는 팝업은 Yes하면 된다. Settings 단축키는 컨트롤+","이다. 컨트..

Web/HTML 2021.01.11
728x90