본문 바로가기

강의실/HTML

그림과 글자 정렬

그림과 글자 정렬
 
 
 
홈페이지를 만들다가 보면 한줄에 그림하나 또는 한줄에 글자만 넣기가 대부분이다. 하지만 가끔 한줄에 그림과 글자를 같이 사용해야 하는경우 글자의 크기와 그림의 크기가 다르기 때문에 글자옆에 그림을 놓거나 반대로 그림옆에 글자를 놓을 경우 크기가 다른 것을 같은 줄에 보여주기 때문에 그 레이아웃이 볼상 스럽다.

이럴경우 그림과 글자를 다음과 같이 정렬하여 원하는 레이아웃을 결정할 수 있다. 보통 글자와 그림을 함께 쓰는 경우는 글자의 크기를 고려해서 그에 적당한 그림을 사용하는것이 대부분이다. 고민해야 할 부분이다.

그림과 글자 정렬방법
예제 설명
<IMG SRC="img.gif" ALIGN="정렬방법"> 정렬방법에는 다음과 같이 세가지가 있으며 각각의 정렬방법에 따라 글자의 위치가 정해진다.

top -글자를 이미지의 윗부분에 정렬.
middle -글자를 이미지의 중앙선에 정렬.
bottom -글자를 이미지의 밑부분에 정렬.
 
   

'강의실 > HTML' 카테고리의 다른 글

그림에 링크 걸기  (0) 2007.07.17
그림지정  (0) 2007.07.17
그림삽입  (0) 2007.07.17
공백넣기  (0) 2007.07.17
글자 속성 지정  (0) 2007.07.16