Study/html
-
semantic elementsStudy/html 2020. 6. 24. 20:47
semantic elements = 의미를 가진 요소들. 시멘틱 요소는 분명하게 이것의 의미를 브라우저와 개발자 모두에게 전달한다. 예를들어, non-semantic요소인 와 은 이것의 내용에 대해 아무것도 말하지 않는다. semantic 요소의 예인 과 , 은 분명하게 이것의 내용을 정의한다. HTML에서의 시멘틱 태그 많은 웹사이트들은 네비게이션, 헤더, 푸터를 가리키기 위해 아래와 같은 HTML 코드를 가진다. HTML에는 웹페이지의 각각 다른 부분들을 정의하기 위해서 사용될 수 있는 시멘틱 요소들이 있다. HTML ELEMENT 요소는 문서 안에서의 한 section을 정의한다. W3C의 HTML 문서에 따르면 : "section은 일반적으로 제목이 있는 주제별 콘텐츠 그룹이다" 홈페이지는 일반적..
-
데이터 속성 사용하기 (data attribute)Study/html 2020. 6. 12. 15:44
html5 특성 요소와 연관되어 있지만 확정된 의미를 갖지 않는 데이터에 대한 확장 가능성을 염두에 두고 디자인 되었다. data-*속성은 표준이 아닌 속성이나 추가적인 DOM 속성, Node.setUserData()과 같은 다른 조작을 하지 않고도, 의미론적 표준 HTML요소에 추가 정보를 저장 할 수 있도록 해준다. data-* 전역 특성은 사용자 지정 데이터 특성(custom data attributes)이라는 특성 클래스를 형성함으로써 임의의 데이터를 스크립트로 HTML과 DOM 사이에서 교환할 수 있는 방법이다. HTML 문법 문법은 간단하다. 어느 엘리먼트에나 data-로 시작하는 속성은 무엇이든 사용할 수 있다. 화면에 안보이게 글이나 추가 정보를 엘리먼트에 담아 놓을 수 있다. 아래 dat..
-
semantic elementStudy/html 2020. 3. 31. 22:12
의미 요소(semantic element) 의미 요소(semantic element)란 그 자체로 의미를 가지고 있는 요소를 가리킵니다. 즉, 요소가 자기 스스로 브라우저와 개발자 모두에게 자신이 사용된 의미를 명확히 전달해 주는 요소를 의미합니다. 의미 요소가 아닌 div 요소나 span 요소 등은 해당 요소가 무슨 목적으로 사용되었는지 코드를 살펴봐야 알 수 있습니다. 하지만 의미 요소인 table 요소는 코드를 보지 않아도 해당 요소가 표를 만드는 데 사용되었다는 것을 이름만 살펴봐도 바로 알 수 있습니다. HTML5에서 추가된 의미 요소 의미 요소설명 HTML 문서나 섹션(section) 부분에 대한 헤더(header)를 정의함. HTML 문서 사이를 탐색할 수 있는 링크(link)의 집합을 정의..
-
html이란 (.MDN)Study/html 2020. 3. 28. 11:12
1. html 이란? HyperText Markup Language 하이퍼텍스트(문장 중의 어구나 그것에 붙은 표제, 표제를 모은 목차 등이 서로 연결된 문자 데이터 파일) 마크 업 언어. (프로그래밍 언어는 아님) 형광펜으로 중요한 부분을 긋고 나누듯, 여기부터 여기까지는 head 야. 여기부터 여기까지는 body야. 여기부터는 이건 box고, a라고 이름을 지을게. 라고 컴퓨터에게 마크업해주는 것이다. 엄청 길고 못생긴 코드들을 작성할 거라, 브라우저에게 각각 이 코드들이 무엇을 뜻하는지 html을 통해 마크업해줘야 한다. "웹을 이루는 가장 기본적인 빌딩블록" 웹 컨텐츠의 구조와 의미를 결정한다. html은 웹 브라우저에 표시되는 글, 이미지 등의 다양한 컨텐츠를 표시하기 위해 '마크업'을 사용한다..