WEBDIR

interactive 검색 결과

해당 글 4건

본문 : 상호작용(Interactive) 요소 - DETAILS, SUMMARY, MENU, COMMAND

사용자들과 상호작용하기 위해서 준비된 요소들에 대해 설명합니다. 인터랙티브 컨트롤 인터랙티브 컨트롤(interactive control)은 사용자가 입력한 데이터를 브라우저나 서버로 전송하기 위한 도구다. 과거에는 데이터 전송을 위해 폼이나 자바스크립트를 이용해야만 했다. 웹이 점점 애플리케이션화 되면서 웹 문서 어느 곳에서든 데이터 전송이 이루어질 필요가 있었고, 이를 위해 새롭게 details, summary, command, menu 요소가 제안되었다. DETAILS 요소 details 요소는 HTML5에 새롭게 추가된 요소로서 세부사항(DETAILS)을 표시한다. 이 요소를 사용하면 세부사항을 선택적으로 보여줄 수 있다. 사용자가 요약(summary)을 선택하면 숨겨져 있던 세부사항이 나타나도록 ..

웹코딩/HTML 2015. 5. 11. 17:00

본문 : 폼(Form) 요소 #3 - TEXTAREA, SELECT, OPTION, OPTGROUP, DATALIST, BUTTON, KEYGEN, METER, PROGRESS, OUTPUT

폼 요소를 소개하는 마지막 장입니다. HTML5에서 추가된 요소들도 포함되어 있지만 브라우저 지원사항이 제각각임에 유념하세요. TEXTAREA 요소 textarea 요소는 텍스트 영역(TEXT AREA)을 표시한다. 텍스트 필드가 한 줄짜리 입력 컨트롤이라면 텍스트 영역은 여러 줄짜리 입력 컨트롤이다. ... cols 속성 cols 속성은 세로 행에 입력될 수 있는 글자 수를 지정한다. 이것은 글자 수에 의해 텍스트 영역의 넓이를 지정하는 것인데 기본값은 20이다. 만약 20자를 넘게 되면 텍스트 영역이 커지는 것이 아니라 스크롤바가 생기면서 원래 저장되었던 텍스트 영역의 넓이는 그대로 유지된다. maxlength 속성 maxlength 속성은 사용자가 입력할 수 있는 최대 글자 수를 지정한다. 이 속성..

웹코딩/HTML 2015. 5. 8. 17:00

본문 : 폼(Form) 요소 #2 - LABEL, INPUT

폼에서 가장 많이 사용되는 label과 input 요소의 다양한 속성들에 대하여 알아봅니다. LABEL 요소 label 요소는 컨트롤 레이블(LABEL)을 표시한다. 레이블은 항목이나 파일을 식별하기 위해 사용되는 제목이나 이름을 말한다. 시각적으로만 그 용도가 표현되므로 브라우저가 레이블과 컨트롤 사이의 관계를 알 수 있도록 label 요소를 사용해야 한다. 이름: for 속성 for 속성은 레이블과 관련된 컨트롤을 지정한다. 컨트롤에 레이블을 제공하는 방법은 크게 암시적 방법과 명시적 방법으로 나뉜다. 암시적 방법 : 이 방법은 label 요소 내에 컨트롤을 둔다. 즉 label 요소 내에 있는 컨트롤은 굳이 밝히지 않아도 관련 있다고 보는 것이다. 명시적 방법 : 이 방법은 for 속성을 이용하여 ..

웹코딩/HTML 2015. 5. 7. 17:00

본문 : 폼(Form) 요소 - FORM, FIELDSET, LEGEND

폼과 관련된 요소와 속성은 사용자들과 상호작용을하는 주요 수단입니다. 첫번째로 폼을 구성하는 기본 구조에 대하여 배워봅니다. FORM 요소 form 요소는 폼(FORM)의 범위를 표시한다. 폼은 사용자 입력을 위한 다양한 형식의 컨트롤(W3C는 입력필드, 버튼 등 폼을 구성하는 입력 요소를 컨트롤이라고 부름)로 구성되는 영역이며, 이 영역의 시작과 종료 지점은 form 요소에 의해 정의된다. 상호작용이 양방향으로 이루어지면서 사용자로부터 데이터를 수집해야 하는 상황이 자주 발생하였고, 이를 위해 고안된 것이 바로 컨트롤이다. 그리고 이 컨트롤들이 모여 있는 곳이 바로 폼이다. ... 폼 요소는 블록 레벨 요소이므로 문서 전체를 폼으로 지정하거나 한 문서 내에 여러 개의 폼을 지정할 수도 있다. actio..

웹코딩/HTML 2015. 5. 6. 17:00