Web Programming/HTML5 (4) 썸네일형 리스트형 Form tag Form 사용자가 입력한 데이터를 수집하며 입력 양식 태그를 포함할 수 있음 action : form data가 전송될 URL method : form data 전달 방식 input : 사용자로부터 데이터를 입력받는 곳 value : 표시되는 글 내용 input tag : 다양한 type 어트리뷰트가 옴 select tag : 복수개의 list에서 복수개의 item을 선택할 때 사용 textarea : text 공간이 생겨, 글자를 입력할 수 있음 button : 클릭할 수 있는 버튼이 생김 (cf 과 유사하지만 text나 image 같은 콘텐츠를 사용하지 못 함) 참고 : https://poiemaweb.com/ 여러 가지의 표현 태그 하이퍼링크 href 어트리뷰트에 링크를 넣어 하이퍼링크를 활성화 시킨다. - 절대, 상대 URL - 페이지 내의 특정 id로의 링크 (ex href="#top" ; 맨 위로 가기) target 어트리뷰트에서는 링크를 클릭했을 때 윈도우를 어떻게 오픈할 지를 지정한다. - _self : 현재 윈도우에서 오픈 (default) - _blank : 새로운 윈도우에서 오픈 ; 보안이 취약할 수 있어 rel="noopener noreferrer"를 추가 권장 List 형식 표현 목록 안의 각 item은 로 표현 ● : 로 표현 1,2,3 : 로 표현 , 을 통해 item 번호도 정할 수 있음 중첩된 예시는 다음과 같다. 테이블 형식 표현 미디어 이미지 : tag 오디오 : tag 비디오 : tag - src : .. Semantic 및 Tag 크롤링 웹사이트의 정보를 수집하는 것을 뜻한다. 검색할 키워드에 대응하는 인덱스를 미리 만들어 검색을 용이하게 한다. 인덱스를 생성할 때 사용되는 정보는 웹사이트의 HTML 코드이다. 이 때 해석하는 것이 시맨틱 요소(Semantic element)이다. HTML 코드 내에서 h1 요소 내의 콘텐츠가 중요한 의미를 담고 있다. 즉, 시멘틱 태그는 콘텐츠의 의미를 명확히 설명하는 역할을 한다. 시맨틱 웹 웹에 존재하는 수많은 웹페이지들에 메타데이터를 부여하여, 기존의 정리되지 않은 데이터 집합인 웹페이지를 '의미'와 '관련성'을 가지는 거대한 데이터베이스로 만드는 것이 목표이다. 문서 형식 정의 tag (Document Type Definition, DTD) tag 라 하며, 출력할 웹 페이지의 형식을 브.. HTML5 기본 문법 HTML의 정의 HTML(HyperText Markup Language)은 웹페이지를 기술하기 위한 마크업 언어이다. - 마크업 언어: 태그 등을 이용하여 문서나 데이터의 구조를 표현하는 언어이다. HTML5 문서의 형식 및 실행 로 시작한다. 실제 HTML document는 , 사이에 기술한다. 사이에는 metadata, title 등을 적으며, 브라우저에 표시되지 않는다. 모든 출력 요소는 ,에 표시된다. 이를 VS Code로 실행을 해보자. HTML5의 기본 문법 요소 start tag, end tag 그리고 태그 사이에 위치한 content로 구성된다. HTML document는 이러한 요소들의 집합이다. 를 안 쓰고 바로 요소 이름을 바로 적어도 자동완성이 됨(VS code에서) 요소의 중첩 요.. 이전 1 다음