728x90
04. 태그를 사용한 문제 II다음 결과 화면을 참고하여 조건에 맞게 웹 문서를 작성하세요.(문서 안에 CSS가 미리 만들어져 있다고 가정한다.) 1. 폼 요소를 삽입할 때 태그를 사용해야 한다.2. 제목은 , 목록은 로 입력한다.3. '이름' 필드는 텍스트 필드로 삽입하고 '공백없이 입력하세요'라는 힌트를 표시한다.4. '연락처' 필드는 전화번호에 맞는 필드로 삽입한다.5. '지원 동기'는 텍스트를 여러 줄 입력할 수 있는 텍스트 영역 필드로 삽입한다.6. 텍스트 영역의 글자 수는 60자, 화면에 표시할 줄 개수는 5개로 지정한다.7. 텍스트 영역에 '본사 지원 동기를 간략히 써 주세요.'라는 힌트를 표시한다.8. 버튼은 태그나 태그를 이용해 만든다. // 코드를 작성하세..
03. 태그를 사용한 문제 I다음 결과 화면을 참고하여 조건에 맞게 웹 문서를 작성하세요.(문서 안에 CSS가 미리 만들어져 있다고 가정한다.) 예약 정보 // 코드를 작성하세요 결과 화면A. 해설우선 의 태그로 순서없는 리스트를 만들어준다. 그 후 '이름'에는 태그 'text'를, '전화'에는 태그 'number'를, '이메일'에는 태그 'email'을 유형으로 넣어준다.마지막 순서로, 'button' 유형으로 버튼을 생성하여 '예약하기'라는 내용을 입력한다. 예약 정보 이름 전화 이메일 예약하기 출처 | Do it! HTML+CSS+자바스크립..
[정리] 2 | 폼에서 사용하는 태그, 태그의 유형, 속성 정리폼에서 사용하는 태그종류설명폼의 시작과 끝을 만든다.폼 요소를 그룹으로 묶는다.필드셋에 제목을 붙인다.사용자가 내용을 입력할 필드를 삽입한다., 드롭다운 목록을 삽입한다.텍스트를 여러 줄 입력할 수 있는 텍스트 영역을 삽입한다.데이터 목록을 삽입한다. 태그의 유형종류설명text한 줄짜리 텍스트를 입력할 수 있는 텍스트 상자를 넣는다.password비밀번호를 입력할 수 있는 필드를 넣는다.search검색할 때 입력하는 필드를 넣는다.urlURL 주소를 입력할 수 있는 필드를 넣는다.email이메일 주소를 입력할 수 있는 필드를 넣는다.tel전화번호를 입력할 수 있는 필드를 넣는다.checkbox주어진 여러 항목에서 2개 이상 선택할 수 있는 ..
[기본 개념] 2 | (2.3) input 태그의 주요 속성, 주요 태그1 폼 삽입하기2 사용자 입력을 위한 input 태그3> input 태그의 주요 속성4> 폼에서 사용하는 여러 가지 태그3 input 태그의 주요 속성자동으로 입력 커서를 갖다 놓는 autofocus 속성 기본형 type=텍스트-입력-필드 autofocus required> autofocus 속성을 사용하면 페이지를 불러오자마자 원하는 요소에 마우스 포인터를 표시할 수 있다. 힌트를 표시해주는 placeholder 속성 기본형 type=텍스트-입력-필드 placeholder="힌트로 표시할 텍스트" required> placeholder 속성을 사용하면 텍스트를 입력할 때 입력란에 적당한 힌트 내용을 표시해서 그 필드를 클릭하면 ..
[기본 개념] 2 | (2.2) input 태그의 type 속성1 폼 삽입하기2> 사용자 입력을 위한 input 태그3 input 태그의 주요 속성4 폼에서 사용하는 여러 가지 태그2 사용자 입력을 위한 input 태그텍스트와 비밀번호를 나타내는 type="text", type="password" 기본형 type="text"> type="password"> 텍스트 필드는 폼에서 가장 많이 사용하는 요소이다. 주로 아이디나 이름, 주소 등 짧은 일반 텍스트를 입력할 때 사용하는데, 비밀번호 필드는 입력하는 내용을 '*' 나 '●' 로 표시한다. 텍스트 필드와 비밀번호 필드에서 사용하는 주요 속성은 다음과 같다. 종류설명size텍스트와 비밀번호 필드의 길이를 지정하여 화면에 몇 글자가 보이도록 할 것인지..
[기본 개념] 2 | (2.1) 폼 삽입1> 폼 삽입하기2 사용자 입력을 위한 input 태그3 input 태그의 주요 속성4 폼에서 사용하는 여러 가지 태그1 폼 삽입하기폼을 만드는 태그 기본형 [속성="속성값"]>여러 폼 요소 폼을 만드는 가장 기본적인 태그로 과 태그 사이에 여러 가지 폼 요소를 넣는다. 태그는 몇 가지 속성을 사용해서 입력받은 자료를 어떤 방식으로 서버로 넘길 것인지 서버에서 어떤 프로그램을 이용해 처리할 것인지 지정한다. 다음을 태그의 속성이다. 종류설명method사용자가 입력한 내용을 서버 프로그램으로 어떻게 넘겨줄 것인지 지정 (get, post)- get : 데이터를 256 ~ 4096byte까지만 서버로 넘길 수 있다. 주소 표시줄에 사용자가 입력한 내용 드..
02. 표 태그를 사용한 문제다음 결과 화면을 참고하여 조건에 맞게 웹 문서를 작성하세요.(문서 안에 CSS가 미리 만들어져 있다고 가정한다.) 1. 4행 3열의 표를 만든다.2. 1 ~ 3행의 첫 번째 열을 합친다.3. 4행의 2열과 3열을 합친다.4. 화면에 내용이 있는 부분은 제목 셀로 지정한다. // 코드를 작성하세요 결과 화면A. 해설1. 4행 3열의 표를 만든다.--> 태그 4개와 태그 안에 태그 3개씩 넣는다.2. 1 ~ 3행의 첫 번째 열을 합친다.--> 1행 1열 태그를 로 바꾸고 2, 3행의 첫째 열 1개씩 지운다.3. 4행의 2열과 3열을 합친다.--> 4행 2열 태그를 로 바꾼다. 열을 합치는 것은 다른 행에 영향 안 끼친다.4. 화면에 내용이 있는 부분은 제목 셀로 지정한다...
01. 텍스트 태그와 목록 태그를 사용한 문제다음 결과 화면을 참고하여 조건에 맞게 웹 문서를 작성하세요. 1. 제목은 가장 큰 제목부터 단계별로 작아지는 태그를 사용한다.2. 텍스트 단락에 줄 바꿈이 있다.3. 목록 부분은 '순서 없는 목록'으로 작성한다.4. 목록 내용 중 굵게 표시한 부분과 이탤릭체로 표시한 부분은 중요하지 않지만 다른 텍스트와 구별하기 위한 것이다.5. '혜택'내용은 '순서 있는 목록'으로 표시하되, 숫자는 알파벳 소문자를 사용한다.6. 문서 마지막에 이미지는 삽입 안 해도 된다. // 코드를 작성하세요 결과 화면A. 해설1. 제목은 가장 큰 제목부터 단계별로 작아지는 태그를 사용한다.--> '수습 국원 모집', '방송에 . . . 환영합니다', '혜택'을 각각 , , 태그..