이미지 태그
페이지 정보
작성자 madalla 작성일13-02-09 08:31 조회2,430회 댓글0건본문
그림 태그의 기본 | |||||
<img src="이미지주소" width="숫자" height="숫자" border="숫자" alt="이미지 설명" > 이미지 주소는 말 그대로 이미지가 있는경로를 의미합니다. http:// 로 시작하는 경로입니다. 자신의 컴퓨터에 있는 이미지를 드림위버나 나모로 불러들이시면 <img src=file:/// ~~> 이런식로 시작하게 되는데 이것을 다른 사이트나 블로그나 카페에 그대로 올리시면 이미지가 안보입니다. 소위 엑박이 되는거죠. 내 컴퓨터는 나만이 볼 수 있는 공간입니다. 컴퓨터 전원이 꺼지면 나도 못보고 상대도 못보죠. 그래서 24시간 풀가동하는 호스팅이나 서버가 존재하고 그 곳에 이미지를 올려주시고 http://~ 로 시작하는 이미지 경로를 적어주시면 됩니다. | |||||
<img src="http://madalla.kr/script/img/6.jpg" width="100" height="100" border="0" alt="이미지"> 이렇게 표현됩니다. 이미지 위에 마우스를 올리면 이미지라는 노란 박스의 글자가 보입니다. 이미지에 대한 설명을 해주는 것입니다. | |||||
이미지를 배경으로 사용하기 | |||||
<table background="http://user.chol.com/~jd13952/mul/6.jpg" width="400" height="300"> 그 예를 적용한 것이 아래 그림입니다. | |||||
배경화면이 움직이지 않고 그 자리, 그 위치에 고정시켜 놓고 싶으시면 bgproperties="fixed"를 넣어 주시면 됩니다<body background="그림파일주소" bgproperties="fixed">스타일로 서식 지정은 여러가지가 있습니다. <STYLE type="text/css"> center. right, left 와 top, bottom, middle을 필요하신대로 골라 적용하시면 될 듯싶습니다.body {background:url(그림파일주소); background-repeat:no-repeat;background-position:right bottom; background-attachment:fixed} <style> background-repeat:no-repeat; 이것은 반복 여부를 나타냅니다. 이해되시죠? <STYLE type="text/css"> center. right, left 와 top, bottom, middle을 필요하신대로 골라 적용하시면 될 듯싶습니다.body {background:url(그림파일주소); background-repeat:no-repeat;background-position:right bottom; background-attachment:fixed} <style> background-repeat:no-repeat; 이것은 반복 여부를 나타냅니다. 이해되시죠? | |||||
추가로 배경색 지정에 대해 알려드립니다. <body bgcolor="red"> 이렇게 표현하시면 됩니다. 그리까 배경색을 지정해 주는 태그는 <body bgcolor="색깔코드"> 가 되겠네요.색상코드는 색상표를 누르시면 보입니다.
테이블 안을 배경색으로 채운 것입니다. 배경화면과 배경색에 대한 이해가 좀 되셨나요? | |||||
그림 여백 주기 | |||||
여백에는 상하여백 : vspace 좌우여백 : hspace 가 있습니다. 1. 좌우 여백 만들기 <img src="그림주소"> 안에 hspace="숫자" 태그를 끼어넣어 그림의 양옆에 여백을 줍니다.(숫자가 커질수록 간격이 커집니다.) <img src="그림주소" hspace="숫자"> 2. 상하 여백 만들기 <img src="그림주소" > 안에 vspace="숫자" 태그를 끼어넣어 그림의 위아래에 여백을 줍니다.(숫자가 커질수록 간격이 커집니다.) <img src="그림주소" vspace="숫자">
| |||||
기타 사용 태그 | |||||
border, align, valign border은 말 그대로 테두리입니다. <img src="경로" border="0" alt="마달라 배경"> border=0은 테두리가 없다는 말입니다. 이미지에 링크를 걸었을 경우 자동으로 테두리가 생기는데 이럴때 저런 식으로 표현을 해주면 테두리가 보이지 않습니다. border="숫자" 로 표현합니다. align은 가로 위치를 어디로 할건지 정하는태그입니다. align="left, right, center" 등 알아서 적용하시며 됩니다. valign=세로 위치를 정하는 태그입니다. valign="top, middle, bottom"
|