분류 전체보기219 3장 실무에서 자주 사용하는 HTML 필수 태그 다루기 공부할내용(60~81쪽) 1. hn 태그(n은 숫자) h는 heading을 나타내며 제목이나 주제를 나타낼때 많이 사용한다. Heading 1 Heading 2 Heading 3 Heading 4 Heading 5 Heading 6 2. p 태그 태그는 본문의 문단을 작성할때 사용하며 본문에 많이 사용한다. paragraph는 문단의 약자입니다 3. br 태그 줄바꿈 할때 사용한다. br은 줄바꿈에 사용합니다. 4. blockquote 태그 출처에서 인용한 문단단위의 텍스트를 작성할때 사용한다. 인용 인용 인용~ 5. q태그 문단안에 텍스트 단위의 짧은 인용문을 작성할때 사용한다. 짧은 인용 인용~ 6. ins 태그와 del 태그 ins 태그는 추가된 텍스트를 나타낼때 del 태그는 삭제된 텍스트임을 나.. 2023. 3. 8. 2장 HTML 문서 작성을 위한 기본 내용 살펴보기 공부할 내용(46~57쪽) 1. HTML의 기본 구성 요소 2. HTML의 기본 구조 3. HTNL의 특징 파악하기 1. HTML의 기본 구성요소 - 태그 태그는 HTML 문법을 이루는 가장 작은 단위를 말한다. - 속성 태그에 어떤 의미나 기능을 보충하는 역할이다. 속성은 으로 구성된다. 위 사진에서 등이 예시이다. - 문법 콘텐츠가 있는 문법과 콘텐츠가 없는 문법으로 나뉜다. 콘텐츠가 있는 문법은 속성의 사진에서 Document이 해당되며 은 시작태그 Document는 콘텐츠 은 종료태그이다. 콘텐츠가 없는 문법은 : 줄바꿈 이 있다. - 주석 주석은 실행결과에는 표시되지 않지만 코드에 메모나 설명등을 넣고 싶을때 사용한다. 형식은 이다 코드 실행 결과 ++ 추가로 단축키인 Ctrl+k+c 로 원하는.. 2023. 3. 7. DOM_4 1. 키보드 이벤트 키보드를 누르고 땔때 마다 이벤트를 발생시킬수 있다. -html click me! -js const input = document.querySelector('input'); input.addEventListener('keydown',function(){ console.log("DOWN") }) input.addEventListener('keyup',function(){ console.log("UP") }) 추가로 키보드를 길게 누르는것도 반응 할수 있다. 2. key 와 code 키보드에서의 실제 위치를 알 수 있다. const input = document.querySelector('input'); input.addEventListener('keydown',function(w){ c.. 2023. 3. 6. 1장 Hello, HTML + CSS + 자바스크립트 (~44p) 1. 홈페이지에서 코드 에디터를 설치한다. (Visual Studio Code 사용) https://code.visualstudio.com/ Visual Studio Code - Code Editing. Redefined Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications. Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows. code.visualstudio.com 2. 설치 후 자기가 사용 하고 싶은 확장프로그램을 설치한다... 2023. 3. 6. DOM_3 1. 계층이동 parentElement 한단계 위로 올라가서 부모 요소가 나오는 대신에 밑으로 내려가서 자녀요소를 출력하는 것이다. -모든요소에게 그 요소를 포함하고 있는 직속 부모 요소는 단 한개이다.(자식요소는 여러개일 수 있다.) 2. 새 DOM 요소 만들기 appendChild() 한 특정 노드를 특정 부모 노드의 자식 노드 리스트 중 마지막에 삽입하는것이다. append() 한번에 한개 이상을 삽입할수 있고 최근에 나왔다. 그래서인지 익스플로어에서는 실행이 불가하다. prepend() 특정 요소의 앞에 무언가를 삽입할때 사용한다. 3. 제거하기 -removeChild 먼저 제거하려는 부모요소를 부르면 되는데 parentElement 로 불러주고 removeChild(제거할 요소)를 입력하면 제거.. 2023. 3. 1. DOM_2 1. 속성 (id 바꾸기) - id가 banner인 이미지가 있다고 하면 아래와 같이 된다. Silkie Chickens 위 id를 변경해서 완전히 다른 id를 부여할수 있다.(예시로 loui3을 id로 해본다.) 그러면 아래와 같이 loui3이 id인 이미지가 있다라는것을 알 수 있다. 2. getAttribute, setAttribute getAttribute은 HTML 자체에서 직접 가져오게 한다.(해당요소에 지정된 값) -제목,id,class등을 갖고 오게 할 수 있다 setAttribute은 선택한 요소에 선택한 값을 넣는것이다. -type을 바꿀수 있다. 3. 스타일 변경하기 마크업을 직접 변경하지 않고 자바스크립트를 통해 스타일을 변경할수 있다. I ♥ Trees 위그림을 html 파일을 건.. 2023. 2. 26. 이전 1 ··· 27 28 29 30 31 32 33 ··· 37 다음
