본문 바로가기

WEB/HTML

(23)
<textarea>태그 태그 : 여러 줄에 해당하는 텍스트를 입력받을 때 사용 -> 한 줄에 해당하는 짧은 텍스트 입력 주요 속성 name="이름" -> 텍스트 영역의 이름 rows="숫자" -> 텍스트 영역의 높이(라인 수) cols="숫자" -> 텍스트 영역의 너비(한 줄에 입력할 수 있는 글자 수) wrap="속성 값" -> 폼으로 전송될 때 줄바꿈 포함 여부 • soft -> (기본값) 자동으로 줄바꿈이 포함되지 않음 • hard -> 자동으로 줄바꿈이 포함되어 전송(cols 속성 지정이 필요) readonly -> 텍스트 영역 읽기 전용(내용출력)으로만 사용 • autofocus, disabled, form, maxlength, placeholder, required 등도 사용 가능 textarea 태그 태그 드롭다운..
HTML - input 태그 태그 : 사용자가 데이터를 입력할 수 있는 입력 타입을 지정 - type 속성의 값에 따라 다양한 형태의 입력 타입을 가짐 - 종료 태그 없이 사용 속성 ( type 속성의 값에 따라 사용 가능한 속성이 달라짐) accept, alt, height, width, src, autocomplete, autofocus, checked, disabled, form, formaction, formenctype, formmethod, formnovalidate, formtarget, list, min, max, step, minlength, maxlength, multiple, name, pattern, placeholder, readonly, required, size, type, value type 의 속성 값..
HTML - <form> 태그 태그 : 사용자로부터 다양한 형태의 데이터를 입력받기 위해 필요한 입력 요소들을 담는 컨테이너 ° 입력요소는 태그 내에서 사용해야 함 - 입력 요소 -> , , 등 ° 결과 화면에서는 아무것도 표시되지 않음 ( , , 등> 주요 속성 1. action="URL" - 데이터를 전달받아 처리할 페이지의 URL 지정 2. method="전송방식" - 데이터 전송에 사용하는 HTTP 방법을 지정 method="get" 또는 method"post" 3. 그 외 - name(폼이름), accept-charset(문자 인코딩 방식), autocomplete(자동완성기능), enctype(method="post"일 때 데이터 인코딩 방식), novalidate(데이터의 유효성 검사하지 않음), target(처리결과를 ..
태그 활용 Toko Tokyo is the capital of Japan, the most populous metropolitan area in the world. HTML is FUN to learn! H 2 O is the scientific term for water My favorite color is blue red. I am so cool. For 50 years, WWF has been protecting the future of nature. The world's leading conservation organization, WWF works in 100 countries and is supported by 1.2 million members in the United States and close t..
HTML - 멀티미디어 표현 HTML 오디오/ 비디오 재생 1. 태그 외부 애플리케이션이나 상호작용 콘텐츠를 위한 컨테이너(html4는 지원X) 속성 src="URL" height/width/type=" " url - 내장되는 외부파일의 주소/이름 height - 내장되는 콘텐츠의 높이 width - 내장되는 콘텐츠의 폭 type - 내장되는 콘텐츠의 미디어 타입 오디오 재생: 비디오 재생: 1. 태그 외부 플러그인의 도움 없이 간단히 오디오 재생 비디오 파일 형식 1. MP4(.mp4) : MPEG-4에서 규정된 비디오 파일 형식/ H.264 비디오 코덱/ AAC 오디오 코덱 2. WebM(.webm) : 구글이 개발한 고화질 영상 압축 형식/ VP8 비디오 코덱/ Vorbis 오디오 코덱 3. Ogg(.ogv) : 멀티미디어 표..
HTML 태그 정리 Line Break - : 줄 바꿈 Paragraph - : 문단/ 단락 : 텍스트를 진하게 표시/ 실제로 페이지내의 중요한 부분으로 브라우저에게 알려주는 역할 Bold - : 텍스트를 진하게 표시/ 서식 상 다른 텍스트와 대비된 스타일을 강조 image : 이미지를 웹페이지에 포함시킬 때 사용 image source : 원하는 이미지의 주소를 적어 웹 브라우저에 위치한 이미지를 표시 (img 태그에 src속성 설정) image width : 이미지 크기를 조절하여 자동으로 웹브라우저 크기에 맞게 이미지 크기를 바꿈 (img 태그에 width 속성 설정) List : 목차, 항목들을 구분/ 부모 태그 필요 Unordered List : 순서가 필요없는 리스트 태그/ 리스트의 부모태그 Ordered Lis..
테이블 콘텐트 그룹핑과 열 단위 스타일 지정 , , 태그 : 테이블에서 행단위 콘텐츠를 각각 헤더, 몸체, 푸터 부분으로 구분하여 그룹핑하는 태그, 테이블의 레이아웃에는 아무런 영향 없음 - 태그의 사용 위치 과목점수 국어90 영어95 수학85 평균90 ▼ 열 단위 스타일 지정 태그 : 하나 이상의 열들을 모아서 한꺼번에 스타일을 지정하는 경우 태그 : 지정한 열에 대해서 서로 다른 포맷팅을 정의하는 태그 태그 내에서 사용 / 종료 태그 없이 사용 span="n"속성 : 해당 태그의 스타일이 적용되는 열의 개수 - 태그 사용위치 중간시험기말시험평균 국어9092.5 영어9593.0 수학8590.0 - 출력결과
셀 병합과 요소 배치 테이블의 기본 형식 테이블 제목 내용 내용 … 내용 내용 … … 셀 병합 : 인접한 여러 셀을 합쳐서 하나의 셀로 만드는 경우 • 보다 다양한 모양의 테이블 생성이 가능 2가지 속성 • rowspan 속성 • colsapn 속성 - 또는 태그 내에서만 사용 - rowspan="n" -> 현재 셀의 위치에서 n개의 행을 병합 (세로방향으로 인접한 n개의 셀을 병합) - colspan="n" -> 현재 셀의 위치에서 n개의 열을 병합 (가로방향으로 인접한 n개의 셀을 병합) 1-11-21-31-4 2-12-22-32-4 3-13-23-33-4 ▼ 열 병합_ colsapn 속성 1-1~1-4 2-1~2-2 2-32-4 3-13-2 3-3~3-4 ▼ 행 병합_ rowspan 속성 1-1 2-1 3-1 1-21-..