안녕하세요 아기크롱입니다.
작성된 글을 읽으시면서 빼먹은 부족한 부분은 댓글고고^^
그럼 시작합시다
1) img를 이용한 그림의 삽입
오늘 배울 내용은 그림을 문서에 넣는 방법입니다, <img> 태그는 그림을 문서에 넣을 때 사용하는 태그입니다. 단독으로 사용되기도 하고 몇 가지 속성을 부여받아 사용되기도 합니다.
(1) width는 문서에 넣을 그림의 가로 너비(폭)를 조절할 수 있게 하는 속성입니다. 작은따옴표의 안에 수치를 입력하여 가로 너비를 조절하실 수 있습니다. (2) height는 문서에 넣을 그림의 세로 너비(높이)를 조절할 수 있게 하는 속성입니다. 마찬가지로 작은따옴표의 안에 수치를 입력하여 세로 너비를 조절하실 수 있습니다. 그림을 문서에 넣을 때, width와 height를 지정해 주지 않는다면 그림의 원래 크기대로 삽입되어집니다.
<img src="images/zoo1.jpg" width="294" height="324" hspace="3" vspace="3" border="5">
(3) hspace는 문서에 넣을 그림의 가로 간격(공간)을 조절할 수 있게 하는 속성입니다. 간격이란, 그림과 글자사이 공간의 너비를 말하는 것입니다. 작은따옴표의 안에 수치를 입력하여 가로 간격을 조절하실 수 있습니다. 그리고 (4) vspace는 문서에 넣을 그림의 세로 간격(공간)을 조절할 수 있게 하는 속성입니다. 마찬가지로 작은따옴표의 안에 수치를 입력하여 세로 간격를 조절하실 수 있습니다.
(5) border는 문서에 넣을 그림의 테두리 두께를 조절할 수 있게하는 속성입니다. 0∼∞의 수치를 작은따옴표의 안에 입력하여 테두리의 두께를 조절하실 수 있습니다. 0으로 지정하시면 그림 주위에 테두리가 없도록 표현되어지고, 숫자를 큰 값으로 지정할수록 테두리는 두껍게 표현이 됩니다.
2) 그림을 문서의 배경으로 넣는 방법
HTML 태그를 사용하는 방법보다는 스타일시트를 사용하여 이미지를 문서의 배경으로 넣는 방법이 훨씬 효과적입니다. bakcground는 문서에 배경으로 넣을 그림이 저장되어 있는 곳의 주소(URL)를 입력하는 곳입니다. <body background="폴더위치/폴더명.gif" bgproperties="fixed">에서 bgproperties=“fixed”는 스크롤바를 움직일 경우에, 배경 그림은 스크롤되지 않도록 고정시켜 주는 것입니다. 즉, body안의 다른 내용들은 모두 스크롤바를 움직임과 동시에 위/아래로 스크롤 되지만, 배경 그림은 스크롤되지 않고 고정되어 움직이지 않게 됩니다.
<audoi> 태그에 대해 알아봅시다.
<audio src= "이름.mp3/wav/ogg">
=> chrome는 mp3 -> ogg, explor e11는 mp3 -> wav로 변환한다.
1) controls 조작표시기가 생긴다. 2) autoplay 자동재생된다.
<video src= "이름.mp4">
※ 이미지: <img src= "이름.jpg">이고, a태그는 src없이 href=''이다.
'WEB 기초 > HTML' 카테고리의 다른 글
| [Table Tag] 테이블 태그 (0) | 2018.11.15 |
|---|---|
| [ul/ol Tag] 리스트 태그와 정렬태그 (0) | 2018.11.15 |
| [font Tag] 글자체 태그 (0) | 2018.11.15 |
| [a Tag] 링크 태그 (0) | 2018.11.15 |
| Html의 기본구조 (0) | 2018.11.15 |