'HTML 배우기'에 해당되는 글 9건
HTML로 이미지위치를 오른쪽, 왼쪽 정렬하기HTML로 이미지위치를 오른쪽, 왼쪽 정렬하기
Posted at 2015. 1. 18. 16:48 | Posted in HTML 배우기반응형
이전에 텍스트와 그림을 가운데 정렬하는 방법을
포스팅 한적이 있습니다.
http://chorong77.tistory.com/18
이번에는 양사이드로 정렬시키는 방법을 알아보도록 하겠습니다.
지금 다시 보니 이전의 포스팅과 합쳐서 하나로 하는 것이
더 좋았는데 이렇게 따로 글을 올리게 되었네요.
아무튼 중간으로 옮기는 방법은 위의 페이지를 참고해주십시오.
1. HTML을 이용하여 텍스트, 이미치를 왼쪽 정렬하기
텍스트의 경우
<p align="left">문자</p>
이미지의 경우
<p align="left"><img src="사진 주소">
별로 어렵지 않죠?
금방 외울 수도 있을 것 같지만,
굳이 외울 필요도 없는 태그입니다.
필요하실 때마다 검색해서 사용하시면 되겠습니다.ㅋㅋ
2. HTML을 이용하여 텍스트, 이미치를 오른쪽 정렬하기
텍스트의 경우
<p align="right">문자</p>
이미지의 경우
<p align="right"><img src="사진 주소">
위와 바뀐 것은 'left'가 들어갈 부분에 'right'가 들어갔다는 것입니다.
만약 가운데로 하고 싶다면,
이 부분을 'center'로 바꾸어주시면 되겠습니다.
3. 사진에 테두리 입히기
<p align="center"><img src="사진 주소" border="1">
일단 사진의 위치는 중간으로 두었습니다.
'border=1'는 테두리의 굵기가 1이라는 뜻입니다.
테두리를 없애도 싶다면 이 부분을 0으로 체크해주면 되겠습니다.
더 굵게 하고 싶다면 숫자를 올려주면 되겠죠.
반응형
'HTML 배우기' 카테고리의 다른 글
HTML로 배경이미지와 색상 넣어주기 (0) | 2015.01.18 |
---|---|
HTML로 동영상 삽입, 유튜브 동영상 링크 삽입하기 (6) | 2015.01.15 |
HTML 그림링크삽입, 새창띄우기 방법 (0) | 2015.01.13 |
html 이미지 넣기와 크기조절 방법 (0) | 2015.01.12 |
html 글씨체, 밑줄 긋기 방법 (0) | 2015.01.12 |