반응형 프로그래밍/HTML48 [HTML] meta 태그 목 차1. meta 태그란?2. charset 속성3. name과 content 속성3-1. 페이지 설명 (description)3-2. 키워드 (keywords)3-3. 저자 (author)3-4. 뷰포트 (viewport)4. http-equiv 속성4-1. 캐시 제어 (cache-control)4-2. 리프레시 (refresh)5. Open Graph 및 Twitter Card5-1. Open Graph (og)5-2. Twitter Card6. 기타 메타 태그6-1. Robots6-2. 권한 정책 (Permissions Policy)7. 요약 1. meta 태그란? HTML의 태그는 웹 페이지의 메타데이터를 정의하는 데 사용됩니다. 메타데이터는 사용자에게 직접 표시되지는 않지만, 브라우저나 검색.. 2024. 10. 15. [HTML] link 태그 목 차1. link 태그란?2. 사용법3. 속성3-1. rel3-2. href3-3. type3-4. media3-5. crossorigin3-6. as4. link 태그의 활용4-1. 파비콘 (favicon)4-2. 폰트 로딩4-3. 피드 (feed)4-4. 프리패치 (prefetch)5. 주의 사항 1. link 태그란?HTML의 태그는 외부 리소스를 현재 HTML 문서에 연결할 때 사용됩니다. 주로 스타일시트(CSS)를 연결하거나, 아이콘을 정의하거나, 피드를 연결하는 등의 용도로 사용됩니다. 태그는 일반적으로 Hello, World! 3. 속성3-1. rel rel 속성은 HTML 문서와 연결된 외부 리소스 간의 관계를 정의합니다. 이 속성은 태그에서 필수적으로 사용되며, 다양한 값.. 2024. 10. 13. [HTML] script 태그 목 차1. script 태그란?2. 사용법2-1. 내부 스크립트2-2. 외부 스크립트3. 속성3-1. async3-2. defer3-3. type3-4. crossorigin4. 자바스크립트 위치5. 주의 사항 1. script 태그란?HTML의 2-2. 외부 스크립트app.js 파일에 있는 자바스크립트 코드를 가져와서 실행합니다. 외부 스크립트는 재사용성이 높고, 코드의 분리와 유지보수가 용이합니다. My Web Page 3. 속성3-1. async async 속성은 외부 스크립트를 비동기적으로 로드하고 실행합니다. 즉, HTML 문서가 계속해서 파싱되는 동안 스크립트를 동시에 로드합니다. 스크립트가 준비되면 바로 실행됩니다.이 속성은 페이지 성능을 높이는 데 유용하지만, 스크립트 실행.. 2024. 10. 12. [HTML] p 태그 - 줄바꿈 목 차1. p 태그란?2. p 태그의 주요 특징3. CSS 스타일 적용하기4. 자주 사용하는 속성 1. p 태그란? 태그는 HTML에서 단락(Paragraph)을 나타내기 위해 사용되는 태그입니다. 기본적으로 텍스트를 블록 레벨 요소로 나타내며, 내용이 끝나면 자동으로 줄 바꿈이 포함됩니다. 2. p 태그의 주요 특징블록 레벨 요소: 태그는 블록 레벨 요소로, 이 태그로 감싼 내용은 기본적으로 다른 콘텐츠와 분리되어 줄바꿈이 적용됩니다.자동 여백: 브라우저에서 태그는 기본적으로 위아래에 여백을 주기 때문에, 단락 간에 간격이 자동으로 생깁니다.중첩 불가: HTML5에서는 태그 안에 또 다른 태그를 중첩해서 사용하면 오류가 발생할 수 있습니다. 한 단락은 하나의 태그로 끝내야 합니다.폐쇄형 태그.. 2024. 10. 9. [HTML] a태그 noopener와 noreferrer 정리 목 차요약1. 왜 noopener, noreferrer를 사용하나요?2. rel 속성 값 : noopener3. rel 속성 값 : noreferrer4. 함께 사용하기 "noopenner와 noreferrer이란 무엇인가?" 요약noopener: 새로 열린 페이지가 원본 페이지의 참조를 가져올 수 없게 하여 보안을 강화.noreferrer: 새로 열린 페이지가 원본 페이지의 리퍼러 정보를 받지 못하게 하여 개인정보 보호를 강화. noopener의 기능도 포함. target="_blank"를 사용할 때 발생할 수 있는 보안 위협을 줄이고, 사용자의 개인정보를 보호할 수 있습니다. 1. 왜 noopener, noreferrer를 사용하나요? noopener와 noreferrer는 보안과 개인정보 보호를 .. 2024. 10. 4. [HTML] a 태그 목 차0. 요약1. 기본 구조2. 주요 속성2-1. href2-2. target2-3. rel2-4. download2-5. title2-6. href="#" 또는 href="javascript:void(0)"2-7. 스타일링 0. 요약 태그는 링크를 만들기 위한 HTML 요소입니다.href 속성은 링크의 목적지를 정의합니다.다른 속성들(target, rel, download, title)을 활용하여 링크 동작을 세밀하게 조정할 수 있습니다. 1. 기본 구조HTML의 태그는 "앵커(anchor)" 태그라고 하며, 웹 페이지에서 다른 문서나 외부 리소스에 링크를 제공하는 데 사용됩니다. 기본적으로 하이퍼링크를 생성하는 태그입니다.href: 사용자가 클릭했을 때 이동할 URL(목적지)을 정의하는 속성입.. 2024. 10. 3. 이전 1 ··· 5 6 7 8 다음 반응형