1. 지금까지 배운 html의 모든 내용을 활용하여 나만의 홈페이지를 만들어 봅니다. html5 이전의 홈페이지는 다음 그림과 같이 프레임을 나누어서 사용하였습니다. 2. 최근에는 프레임을 구분하지 않고 영역을 나누어서 한 페이지로 구성하는 방법을 주로 사용합니다. html5에서는 CSS를 이용해서 각 영역을 미리 지정하여 사용할 수 있습니다. 3. 나만의 홈페이지를 만들기 위 홈페이지 레이아웃을 구성합니다. 4. 내비게이션 부분의 메뉴에 연결할 웹 페이지를 만듭니다. 메뉴 연결할 페이지 나의 소개 2-1.html(소개 페이지) 나의 앨범 4-3html(앨범 페이지) 포트폴리오 6-3.html(동영상 페이지) 최근에는 연결할 페이지도 모든 영역이 포함된 코드로 만들어져 페이지가 전체적으로 변경되는 방법을..

1. 지금까지는 디자인에 상관없이 요소에서 속성을 사용하여 여러 가지 색상이나 글꼴, 크기 등을 바꾸어 보았습니다. 최종적으로html을 이용한 나만의 홈페이지를 만들려면 홈페이지 전체의 디자인을 생각해야 합니다. 따라서 여기에서는 html에서 디자인을 담당하고 있는 CSS( Cascading Style Sheets )를 사용하여 다양한 디자인을 만들어 봅니다.2. 간단한 CSS를 만들어서 사용해 봅니다. CSS를 만들어 봅시다! 3. CSS를 사용하는 3가지 방법 1. 인라인 방식 : 2. 임베디드 방식 : head 태그 안에 style 태그를 사입하는 방식입니다. ( 3과 같은 방식 ) 3. 외부 링크 방식 : css 파일을 만들어 놓고 연결하여 사용하는 방식입니다. .css파일을 미리 만들어 놓고 사용

1. 홈페이지를 만들 때 이미지뿐만 아니라 다양한 멀티미디어를 삽입하면 어떨까요? 동영상이나 멀티미디어를 홈페이지에서 바로 보여 줄 수 있도록 만들어 봅니다. 2. 비디오를 사입하는 방법을 알아봅니다. 브라우저에서 비디오를 지원하지 않습니다. 3. html5에서 지원하는 비디오 파일의 종류와 브라우저 버전을 알아봅니다. 파일 형식 설명 OGG (.ogg, .ogv) 스트리밍 방식의 멀티미디어 표현을 위한 공개 소스 기반의 파일형식 입니다. MPEG4 (.mp4, .m4v) MPEG-4에서 규정된 비디오 파일 형식이니다. WebM (.webm) 구글이 html5의 동영상에 사용하기 위해 개발한 오픈 소스 방식의 멀티미디어 파일입니다. 브라우저 버젼 MP4 WebM Ogg 크롬 4.0 YES YES YES ..

1. 홈페이지를 만들 때 이미지뿐만 아니라 다양한 멀티미디어를 삽입하면 어떨까요? 동영상이나 멀티미디어를 홈페이지에서 바로 보여 줄 수 있도록 만들어 봅니다. 2. 오디오를 사입하는 방법을 알아봅니다. 브라우저에서 오디오를 지원하지 않습니다. 3. html5에서 지원하는 오디오 파일의 종류와 브라우저 버전을 알아봅니다. 파일 형식 설명 MP3 (.mp3) MPEG-1의 오디오 규격으로 개발된 형식으로 현재 널리 이용되고 있습니다. WAVE (.wav, .wave) MS사와 IBM이 개발한 비압축 형식의 오디오 파일입니다. 주로 윈도우즈에서 사용됩니다. OGG (.ogg, .ogv) 스트리밍 방식의 멀티미디어 표현을 위한 공개 소스 기반의 파일 형식입니다. 브라우저 버젼 MP3 WAV Ogg 크롬 4.0 ..

1. 하이퍼링크 태그 속성속성 설명 href="주소" 링크가 연결된 주소를 지정합니다. id="이름" 웹페이지 내에서 이동할 위치를 지정합니다. target="속성" 링크가 열릴 창을 지정합니다. _self : 현재 창에서 바로 보여 줍니다. target 속성을 사용하지 않으면 기본 값으로 현재 창에서 바로 보여줍니다. _blank : 새로운 창으로 보여 줍니다.title="내용" 링크에 마우스를 올렸을 때 보이는 내용을 지정합니다. 2. 페이지 이동 예제 앙큼한유채 3. 이미지로 페이지 이동 앙큼한유채 > 4. 페이지 내 이동 1. 하이퍼링크 페이지 이동 앙큼한유채 > 2. 이미지 클릭 페이지 이동 페이지 내 이동 나의 도서 목록 포트폴리오 나의 도서 목록 포트폴리오에서는 현재까지 내가 읽은 도서 목록..