HTML5 HTML | 2. 기본 구조 HTML (Hyper Text Markup Language) 는 웹페이지를 위한 표준 마크업 언어입니다. 웹사이트를 만들 수 있고 배우기도 쉽습니다. HTML의 구조 테스트 전체적인 구조는 위와 같습니다. 아래의 한 줄만 보겠습니다. 테스트 요소 (Element) 위의 한 줄 전체가 html에서 개별적인 역할을 하기 때문에 '요소'라고 불립니다. 보통 시작태그와 종료태그로 구성된 내용을 포함한 태그 전체를 말합니다. 위 예시에서 요소는 테스트 태그 (Tag) 태그는 객체를 만들 때 사용됩니다. 시작태그 : 끝태그 : 속성 (Attribute) 속성은 태그에 추가로 정보를 제공하거나 태그의 동작이나 표현을 제어하는 설정값 위 예시에서 속성은 class "test"란 속성 값을 갖고 있는 class는 h1의.. 2021. 1. 6. HTML | 6. 인라인 프레임 (iframe) 속성 아이프레임은 HTML 문서에서 임의의 위치에 다른 HTML 문서를 보여주는 내부 프레임 태그입니다. 웹페이지 안에서 다른 페이지의 일정 부분만 보여주고 싶을 때, 웹 페이지를 또 만들기 보다는 적절하게 크기와 모양을 다듬어 보여주면 효율적이겠죠? 예를 들어 쇼핑몰이 여러 곳에 있다고 가정해 볼게요. 메인 쇼핑몰이 있고 이제 각종 스토어에 확장하려고 합니다. 그러면 각 스토어에 상품 상세페이지를 다 꾸며주려면 많은 시간과 노력이 필요합니다. 상세페이지에 iframe을 사용해 필요한 부분만 메인 쇼핑몰에서 불러온 다면 편합니다. 주의할 점은 iframe을 추가할 때 마다 header footer을 깐다고 해도 완전한 페이지에 가깝기 때문에 무겁습니다. 무겁다는건 로딩이 오래걸리고 컴퓨터 메모리 등을 더 잡아.. 2020. 12. 12. HTML | 1. 기초 HTML HTML (HyperText Markup Language) 은 웹페이지를 만드는데 사용하는 언어입니다. HTML 구조 12345 문서구분, 버전 -> 브라우저가 해석 메타정보 인코딩 방식 화면cs 웹 페이지의 디자인이나 기능을 결정하는 태그로 이루어진 언어로 안에 표현됩니다. HTML 태그 태그 링크 태그 — ... 태그 id 속성 — 하나하나 특별한 제어class 속성 — 전체적인 스타일을 일관성 있게 지정하기 위해 필요 목록 태그 : 순서없는 목록(unorder list) 태그 : 순서있는 목록(order list) : 리스트 : 제목과 설명이 한쌍 : 제목 : 설명 레이아웃 태그 : 화면을 구성하는 태그header : 상단영역 nav : 네이게이션 영역 section : 본문영역 aside.. 2020. 11. 20. Web API File File API - 로컬의 파일의 정보나 내용을 가져오기 위한 API.- 파일 API가 나오기 전에는 파일의 정보나 내용을 자바스크립트로 읽어서 다루지 못했습니다.- input type="file" File 객체- FileReader메서드readAsDataURL(blob) : DataURL형식으로 파일을 읽습니다.이벤트 핸들러onload : 읽기에 성공했을 경우 실행되는 이벤트 핸들러프로퍼티result : 읽기 결과가 저장 Formdata formdata 객체키와 값의 쌍으로 폼 name 속성은 value에 접근할 때 필요합니다.ie9 이하는 작동되지 않습니다. -> ajaxform 으로 대체합니다. 파일업로드 처리 (ajax와 formdata)html file 폼 onchange -> read.. 2020. 9. 22. HTML | 3. 태그와 속성 태그와 속성 기본태그 : 문서 타입 정의. 최상단에 위치 : 전체 도큐멘트 : 문서의 기본설정이나 외부 스타일 시트 파일, js 파일 연결 등 : 도큐멘트 바디, 실제 브라우저 화면에 나타나는 부분 : 메타 태그 제목과 단락 : 제목 (heading) 태그. h1 ~ h6 : 단락 (paragraph) 태그 텍스트 : bold. 글자를 굵게 : italic. 글자를 기울인다. : underline. 글자에 밑줄 : strike. 글자에 중간선 링크 : anchor 태그. 링크 생성 - href 속성 : 반드시 가지고 있어야할 속성 - target 속성 : 어느창에서 열 것인가. _self _blank _parent _top 내부 링크 : 같은 페이지 내 특정 위치로 이동하고자 하는 경우 컨테이너 단순히 .. 2020. 3. 27. 이전 1 다음
