HTML

태그는 사용자로부터 값을 입력받을 수 있는 대화형 컨트롤(=필드)를 나타낸다. 기본적으로 인라인 요소이고, 닫는 태그가 없는 단일태그이다. 태그는 type 속성을 통해 입력받는 요소의 데이터 유형이 달라진다. 사용가능한 type 은 20여 가지이며, 기본값은 text 이다. 다양한 type text 디폴트 값. 한줄의 텍스트 필드이다. 새줄 문자는 입력값으로부터 자동으로 제거 됨. password 값이 가려진 한줄 텍스트 필드. 사이트가 안전하지 않으면 사용자에게 경고 radio 같은 name 값을 가진 여러개의 선택중에서 하나의 값을 선택하게 하는 라디오 버튼 submit ~ 내에 있는 정보들을 서버로 전달하는 버튼 range 값이 가려진 숫자를 입력하는 컨트롤. 디폴트 값이 중간값인 범위 위젯으로 표..

태그는 anchor의 약어로 닻을 의미한다. 태그는 href 속성을 통해 다른 페이지, 전화번호, 이메일주소 와 그 외에 다른 url로 연결할 수 있는 링크(연결)을 만든다. 인라인 요소이고, 콘텐츠는 주로 링크의 목적지를 나타낸다. 태그의 대표 속성 href : 연결하고 싶은 주소를 지정한다. target : 링크를 클릭했을 때 창의 형태를 지정한다.(총 4가지) _blank : 새창에서 열기 _self : 현재 탭에서 열기(기본값) _top : _bottom title : 링크에 대한 설명이 들어간다. href 속성의 다양한 활용 a 태그의 href에는 웹 문서의 주소 뿐만 아니라 전화번호나 메일주소 등을 지정할 수도 있다. 이때 각 유형별로 필요한 추가 텍스트가 있다. 1. 전화번호 전화 걸기 2...

콘텐츠나 레이아웃에 아무런 영향도 주지 않고, 여러 요소들을 하나로 묶어 관리하기 편하게하는 태그를 컨테이너 태그라고 한다. 콘텐츠 내용을 구분하거나, 특정 영역마다 공통적인 스타일(css)를 적용하고자 할 때 개발자는 컨테이너태그를 사용하는 것이 좋다. 컨테이너 역할을 담당하는 태그는 크게 시멘틱(Semantic) 태그와 논-시멘틱(non-Semantic) 태그로 나뉜다. 시멘틱(Semantic) 태그 시멘틱 태그란 브라우저, 개발자와 사용자에게 태그에 종속되어있는 내용을 직설적으로 알려주는 태그이다. 태그의 종류로는 header, nav, section, article, aside, footer 가 있다. header : 전체 사이트의 헤더, article에 관련된 헤더이다. nav : 로그인, 목차..

태그는 이미지를 표시할 때 일반적으로 사용하는 태그이다. (참고로 이미지를 표시하는 방법에는 표시할 엘리먼트 대상에 background-image 속성으로 정의하는 방법도 있다.) 단일 태그로서 닫는 태그를 필요로 하지 않는다. 콘텐츠를 적어주는 대신 표시할 이미지에 대한 정보를 속성으로 지정해주어야 한다. 기본 형태 태그의 속성들을 확인해보자면 먼저 src 속성은 표시할 이미지의 경로 정보와 파일명을 입력받는 속성이다. 즉 이미지의 url을 입력받는다. 서버(클라우드)에 위치한 이미지 파일도 가능하고, 내 로컬 PC에 저장된 이미지 파일도 가능하다. 예시 두번째로 alt 속성은 alternative의 약자로 대체 텍스트 역할을 한다. 이미지가 로딩되기 전이나 이미지 로딩에 실패한 경우 이미지 대신에 대..

HTML 은 Hyper Text Markup Language 의 약자로 하이퍼링크를 통해 특정 웹 페이지에서 다른 페이지로 접근할 수 있는 마크업 언어이다. HTML의 기본 구조 브라우저 화면에 표시할 부분 HTML 은 크게 영역과 영역 총 2가지 영역으로 나누곤 한다. 쉽게 생각해서 한 웹 페이지 화면을 나눈다고 생각했을 때 웹 브라우저 화면에 보이진 않지만 웹 브라우저가 알아야 할 정보들은 모두 이 태그에 들어간다. : 문자 인코딩 및 문서 키워드 등에 대한 요약 정보를 기입하는 단일 태그이다. ~ : 문서의 제목을 나타낸다. 콘텐츠는 브라우저탭에 표시된다. : 해당 웹 페이지에서 사용할 Javascript 정의 : CSS 파일 내부에서 정의 : CSS 파일 외부에서 정의해서 사용 ~ 실제 브라우저 ..