Friday, December 15, 2006
HTML-CSS] 이미지/사진, 화면 가운데(중앙)로, 우측으로 정렬 방법; IMG Center Right
그림/사진을 화면 가운데 또는 우측으로 위치시키려면 다음과 같이 합니다.
이미지 태그를 div 태그로 둘러싸 준 후, align="center" 라는 속성을 지정합니다. 그러면 그림이 웹페이지의 중앙에 위치하게 됩니다.
옆으로스크롤가능
결과 예제:
옆으로스크롤가능
위와 같이 right 라는 값을 지정하면 우측 가장자리에 정렬됩니다.
결과 예제:
옆으로스크롤가능
그런데 이 방법은, 파이어폭스에서 잘 안 되는 경우가 있습니다.
텍스트/문단 정렬하는 법: ▶▶ HTML-CSS] 텍스트 중앙(가운데) 정렬, 양쪽/우측/좌측 맞춤 태그; Text Align Tag
그림을 "페이지 가운데"로 이동 (중앙에 정렬)
이미지 태그를 div 태그로 둘러싸 준 후, align="center" 라는 속성을 지정합니다. 그러면 그림이 웹페이지의 중앙에 위치하게 됩니다.
옆으로스크롤가능
<div align="center"><img src="그림 주소" alt="그림 설명" /></div>
결과 예제:
그림을 페이지 우측으로 정렬
옆으로스크롤가능
<div align="right"><img src="그림 주소" alt="그림 설명" /></div>
위와 같이 right 라는 값을 지정하면 우측 가장자리에 정렬됩니다.
결과 예제:
CSS 로, 가운데 정렬
옆으로스크롤가능
<div style="text-align:center"><img src="그림 주소" alt="그림 설명" /></div>
그런데 이 방법은, 파이어폭스에서 잘 안 되는 경우가 있습니다.
텍스트/문단 정렬하는 법: ▶▶ HTML-CSS] 텍스트 중앙(가운데) 정렬, 양쪽/우측/좌측 맞춤 태그; Text Align Tag
tag: html
HTML | CSS | 자바스크립트 JavaScript
잘보고 갑니다...
반갑습니다.
(∩_∩)
<< Home