HTML 34

HTML : 목록을 나타내는 <ul>, <ol>, <li>

HTML : 목록을 나타내는 , , : Unordered List 비정렬 목록 순서 없이 아이템을 나열할 때 사용한다. ex: 메뉴 요소에 중첩되어 사용할 수 있다. 과 섞어서 사용할 수 있다. 예제 : 비정렬 목록 - 순서가 없이 아이템을 나열할 때 사용 HTML 삽입 미리보기할 수 없는 소스 비정렬 목록 순서가 없이 아이템을 나열할때 사용 ex:메뉴 예제 : 과 섞어서 사용할 수 있다. HTML 삽입 미리보기할 수 없는 소스 Nestion 리스트 : Ordered List 정렬하는 목록 각각 숫자를 갖고 있다. ex : 순위표, 레시피 등 예제 : 정렬할 때 사용하는 목록 HTML 삽입 미리보기할 수 없는 소스 정렬 목록 각각 숫자를 갖고 있음 ex: 순위표. 레시피 예제 : reversed 내부의 ..

STUDY/HTML 2022.07.07

HTML : 모든 Entity(엔티티)가 적혀있는 웹 사이트

HTML : 모든 Entity(엔티티)가 적혀있는 웹 사이트 HTML에서 지원하는 모든 Entity가 적혀있는 웹사이트이다. 새로 추가 되는 것이 있을 때마다 업데이트가 되므로, 필요한 엔티티가 있다면 ctrl + F 혹은 Command + F를 통해서 검색하면 된다. HTML Standard HTMLLiving Standard — Last Updated 6 July 2022 ← 13.2 Parsing HTML documents — Table of Contents — 14 The XML syntax → 13.5 Named character references 13.5 Named character references This table lists the character reference names tha..

STUDY/tip 2022.07.07

HTML : 엔티티 (Entity) HTML 내에서 특수문자 작성하기

HTML : 엔티티 (Entity) - HTML 내에서 특수문자 작성하기 엔티티 (Entity) HTML 에서 문자 ," 및 & 은 특수문자이기때문에 해당 특문을 작성하면 코드로 인식한다 (예약어) 그렇기에 코드로 인식되지 않게 하기 위해서 entity 를 사용한다. 사용법 : &이름; - 앰퍼센트 (&)로 시작하고 세미콜론(;)으로 끝나는 텍스트 모양 코드 ( greater than) > " " ' &apos; & & 띄어쓰기 (non breaking space) 더많은 엔티티 (Entity)를 보려면 아래 웹페이지를 참고하면 된다. HTML Standard HTMLLiving Standard — Last Updated 6 July 2022 ← 13.2 Parsing..

STUDY/HTML 2022.07.07

HTML : 시맨틱 웹(Semantic Web) - <article>

HTML : 시맨틱 웹(Semantic Web) - 문서, 페이지, 애플리케이션 또는 사이트 내의 독립적으로 구분해 배포하거나 재사용할 수 있는 구획을 말한다. 인터넷 뉴스 기사를 다른 웹사이트에 스크랩하더라도 내용을 이해하는 것에 문제가 되지 않는 것처럼 현재 페이지가 아니더라도 다른 웹페이지에 표시하더라도 문제되지 않는 콘텐츠를 담을때 사용한다. 여러 을 가질 수 있다. 기사 1 기사 2 기사 3, 정보 1 정보 2 정보 3 등 자체가 콘텐츠가 될 수 있지만 제목을 사용할 땐 ~ 을 이용하여 나타낸다. 기술 요약 콘텐츠 카테고리 : 플로우 콘텐츠, 구획 콘텐츠 가능한 콘텐츠 : 플로우 콘텐츠 태그 생략 : 종료 태그 생략 불가 가능한 상위 요소 : 플로우 콘텐츠를 허용하는 모든 요소 요소는 의 하위 ..

STUDY/HTML 2022.05.31

HTML : 시맨틱 웹(Semantic Web) - <main>

HTML : 시맨틱 웹(Semantic Web) - 의 주요 콘텐츠를 나타내며, 유일무이한 태그이다. 하나 이상을 써야 할 경우 주요 콘텐츠 외의 부분은 을 사용하여 눈에 보이지않게 해야 한다. (접근성과 관련 있음) 대부분의 브라우저에서는 지원하나 Internet Explore 에선 지원하지 않는다. Internet Explore 11 이하에서 작동해야 할 경우 하단과 같이 작성한다. 구형 브라우저를 지원할 필요가 없다면 role="main"보다 을 사용한다.. 예제

카테고리 없음 2022.05.31

HTML : 시맨틱 웹(Semantic Web) - <aside>

HTML : 시맨틱 웹(Semantic Web) - 문서의 주 내용과 직접적인 연관은 없지만 간접적으로 연관이 있을 때 사용한다. 영어의 단어 뜻이나 블로그 류의 추가적인 콘텐츠(광고 등)를 나타날 때 사용한다. 와는 성격이 다르다. 는 부가적인 내용이지만 굳이 없더라도 문제가 되지 않는다. 예제 HTML 삽입 미리보기할 수 없는 소스 Salamanders are a group of amphibians with a lizard-like appearance, including short legs and a tail in both larval and adult forms. The Rough-skinned Newt defends itself with a deadly neurotoxin. Several spec..

STUDY/HTML 2022.05.31

HTML : 시맨틱 웹(Semantic Web) - <nav>

HTML : 시맨틱 웹(Semantic Web) - 문서의 부분중 현재페이지내 또는 다른 페이지로의 링크를 보여주는 구획이다. ( 예제 01참고 ) 현재 어느 경로에 있는지를 나타내며, 다른페이지로 넘어갈수있다. 예제 01 HTML 삽입 미리보기할 수 없는 소스 Bikes BMX Jump Bike 3000 메뉴,목차,색인 현재페이지내에서 누르면 이동하여 보여주는것을 말한다. 와는 성격이 다르다. 는 모든 웹페이지에 동일하게 들어가며, 전체를 아우르는 링크를 담고있다. 는 현재의 웹페이지의 상위나 현재 페이지내의 개요를 담고 있다. 기술요약 콘텐츠 카테고리 : 플로우 콘텐츠, 구획콘텐츠 가능한 콘텐츠 : 플로우 콘텐츠 태그생략 : 종료태그 생략 불가 가능한 상위요소 : 플로우 콘텐츠를 허용하는 모든 요소 ..

STUDY/HTML 2022.05.31

HTML : 시맨틱 웹(Semantic Web) - <footer>

HTML : 시맨틱 웹(Semantic Web) - 주로 웹의 맨 하단에 위치해있다. 웹페이지의 정보나 연관된 사이트를 나타낼 때 사용한다. 작성자, 저작권 정보, 관련 문서 등의 내용을 담는다. 기술 요약 가능한 콘텐츠 : 플로우 콘텐츠 가능한 콘텐츠 : 플로우 콘텐츠 단, 와 다른 는 하위 요소가 될 수 없다. 태그 생략 : 종료 태그 생략 불가 가능한 상위 요소 : 플로우 콘텐츠를 허용하는 모든 요소 단, 요소는 , , 혹은 다른 의 하위 요소가 될 수 없다. HTML 삽입 미리보기할 수 없는 소스 레슈의 연락처 sol.reshur@gmail.com 123 456-78.." data-og-host="sol-reshur.tistory.com" data-og-source-url="https://sol-..

STUDY/HTML 2022.05.31

HTML : 시맨틱 웹(Semantic Web) - <header>

HTML : 시맨틱 웹(Semantic Web) - 소개 및 탐색에 도움을 주는 콘텐츠를 넣는다. 제목, 로고, 검색 폼, 작성자 이름 등의 요소를 포함한다. 소개를 위한 요소로 넣을 경우 전체 웹페이지에 하나만 사용해야한다. 페이지 제목 예시 : 페이지 전체를 아우르는 제목 으로 작성 시 사용한다. HTML 삽입 미리보기할 수 없는 소스 Main page 예시를 위한 글입니다. 글 제목 예시 : 각각의 기사, 아티클엔 나 을 사용해야 한다. HTML 삽입 미리보기할 수 없는 소스 The Planet Earth Posted on Wednesdaty, 3 03 2022 by me blah blah blah ~ 기술 요약 콘텐츠 카테고리 : 플로우 콘텐츠 가능한 콘텐츠 : 플로우 콘텐츠 , 단 다른 또는 는..

STUDY/HTML 2022.05.27

HTML : 시맨틱 웹(Semantic Web)

HTML : 시맨틱 웹(Semantic Web) 시맨틱 웹 이란? (Semantic Web) Semantic : 의미의, 의미론적인 요소의 의미를 고려하여, 구조를 설계하고 코드를 작성하는 것을 말한다. 시맨틱 웹을 사용하면 이로운 점 검색 엔진은 의미론적 마크업을 분석하여 페이지의 검색 랭킹에 영향을 줄 수 있는 중요한 키워드로 간주한다. 시각장애가 있는 사용자가 스크린리더로 탐색할때 의미론적인 마크업을 푯말로 사용할 수 있다. (웹 접근성) 의미가 없는 끊임없는 를 탐색하는 것보다 의미 있는 코드 블록을 찾는 것이 훨씬 쉽다. 개발자에게 태그 안에 채워질 데이터 유형을 제안할 수 있다. 의미 있는 이름 짓기(Semantic Naming)는 적절한 사용자 정의 요소, 구성요소의 이름 짓기(Naming)..

STUDY/HTML 2022.05.27