WEB (33) 썸네일형 리스트형 태그 활용 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-.. 테이블의 기본 형식 과목별 성적 과목중간시험기말 시험 HTML웹프로그래밍 30 66 알고리즘 28 70 : 테이블에서 하나의 줄에 해당하는 행을 정의하는 태그 : 테이블에서 데이터(이미지,텍스트)가 표시되는 표준셀을 정의/반드시 태그내에서 사용/ 왼쪽 정렬 : 테이블 내부에서 행열의 제목을 표시하는 헤더셀을 정의 / 태그내에서 사용/ 진하게 가운데 정렬 : 테이블 전체에 해당하는 제목을 표시/ 테이블 레이아웃에는 아무런 영향을 미치지 않음/ 반드시 시작태그의 바로 다음에 위치해야 함 / 테이블 상단에 진하게 가운데 정렬 CSS - caption-side 속성과 text-align 속성으로 변경 가능 <iframe> 태그와 이미지 맵 페이지에 창을 삽입하는 태그 : 현재의 페이지 안에서 다른 웹페이지를 표시하는 창을 삽입하기 위한 태그 주요 속성 5가지 • name="이름" - 창의 이름 지정 • src="URL" - 창에 표시될 문서의 URL 지정 • srcdoc="HTML코드" - 창에서 보여줄 HTML콘텐츠 지정 srcdoc 속성이 지정되면 src 속성에서 지정된 콘텐츠는 무시됨. • width="픽셀" - 창의 폭 지정 • height="픽셀" - 창의 높이 지정 네이버 내 페이지 구글 이 브라우저는 iframe 요소를 지원하지 않습니다. 이미지맵 : 하나의 이미지를 여러 개의 영역으로 나누어 각 영역마다 링크를 지정하는 것 ... ▼ HTML - 하이퍼링크 삽입 1. 태그 - 기본 형식 링크를 걸어 줄 내용물(텍스트, 이미지) - 주요 속성 • href="URL" -> 링크를 통해 이동하려는 곳의 경로/ 주소 지정 네이버 원래 크기로 그림을 보려면 여기를 이전 1 2 3 4 5 다음
