이미지, 색, 배경


<body> ... </body>- 배경(background) 그림을 설정

<img> - 배경그림외의 모든 그림을 설정


속성(<body></body>)

  • background="url" - 배경그림을 지정
  • bgcolor="#FF00FF" - 배경색깔을 지정

bgcolor background

속성(<img>, 닫는 태그 없음)

  • src="url" - src는 그림의 위치를 지정하는 속성이다. 넣고자 하는 그림파일이 있는 곳의 경로를 url 부분에 지정한다.
  • width="n", height="m" - 이미지의 폭과 높이를 지정하는 것으로 n, m은 %나 pixel단위이다. %단위는 브라우저 화면의 크기에 비례한다.
  • border="n" - 화면에 나타난 이미지에는 일반적으로 테두리가 없다. border는 이미지의 테두리를 표시하며 n은 테두리의 굵기를 나타낸다.
  • alt - 그림을 표시하지 못하는 웹브라우저가 텍스트 상태로 웹 검색을 할 경우 이미지를 로딩할 수 없다. 이런 경우에 텍스트로 그림 내용을 써서 보여 줄 수 있다. 사용자 편의를 위해서 가능한 적어주는 것이 좋다.
  • hspace="n", vspace="m" - 이미지 주위에 여백을 만들어 준다. HSPACE는 좌/우 여백을, VSPACE는 위/아래 여백을 말한다.
  • align - 텍스터와 이미지 정렬에 이용, 이미지에 뒤이어 나오는 문장을 이미지의 오른쪽에서 위/가운데/아래 에 붙일 것인가를 지정하는 곳이다. 아무런 지정이 없다면 밑으로 붙인다. left : 그림이 왼쪽에 오며, 텍스트는 오른쪽 빈 공간에 메워진다. rigth : 그림이 오른쪽에 오며, 텍스트는 왼쪽에 메워진다.

예제보기