HTML6 HTML | 콘텐츠 삽입 태그 iframe, embed, object 비교 외부 콘텐츠를 로드하는데 사용되는 HTML 태그인 iframe, embed, object 태그를 소개하고 장단점을 비교해 보겠습니다. 목차 1. iframe 태그 소개콘텐츠를 표시하고 공유하는데 가장 많이 사용되지만 몇 가지 단점이 있습니다. ▶ 예제 단점▶ 외부 콘텐츠를 포함하기 때문에 웹사이트 디자인을 망가질 수 있고 검색 엔진에 색인되지 않기 때문에 SEO에 부정적인 영향을 줄 수도 있습니다. 또한 iframe으로 로드할 때 보안 문제가 발생할 수도 있습니다.▶ 테이블 안에서 사용 시 높이 조절이 매우 어렵습니다. 2. embed 태그 소개간단하게 외부 콘텐츠를 보여주는데 사용합니다. object와 달리 대체 콘텐츠를 지원하지 않기 때문에 미지원 브라우저에서는 아무 것도 안 보이는 경우가 발생.. 2024. 7. 26. 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 다음
