DÙNG CODE ĐỂ ĐỊNH VỊ ẢNH TRÊN TRANG

1- Định vị tương đối

1- Code để dán một ảnh:


Trong trang soạn thảo blog có sẵn công cụ để chèn ảnh và định vị ảnh một cách tương đối trên trang. Khi đã dán một ảnh vào blog ta có thể coi ảnh như một đơn vị xử lý văn bản : sau khi nhấp vào ảnh thì dùng ngay công cụ căn lề để định vị tương đối cho ảnh ở một trong 3 vị trí ( trái, giữa, phải ).  Nếu không muốn dùng công cụ này ta có thể sử dụng code HTML để dán và định vị ảnh.
Công thức code của một ảnh để dán vào HTML  như sau:
<IMG src=” # ” width=”x” height=”y” border=n>
Trong đó:
# là địa chỉ (URL) của ảnh trên mạng.
x ( chiều ngang ảnh – tuỳ ý)
y ( chiều cao ảnh - tuỳ ý)
n ( trị số rộng bản của đường khung bao ảnh = 0,  hay tuỳ ý có thể cho bằng 1, 2, 3, ….)
Ví dụ một ảnh có địa chỉ (URL) là:
http://img233.imageshack.us/img233/3757/ceaf706c093d3a2514abcd3.gif
Áp dụng công thưc trên ta có code để dán ảnh là:
<IMG height=300 src=”http://img233.imageshack.us/img233/3757/ceaf706c093d3a2514abcd3.gif” width=600 border=0>
2- Định vị ảnh:
- Nếu ta muốn đặt ảnh về bên trái thì thêm vào truớc <IMG cụm <P align=left>
Ví dụ:
<P align=left><IMG height=300 src=”http://img233.imageshack.us/img233/3757/ceaf706c093d3a2514abcd3.gif” width=600 border=0></P>
- Nếu ta muốn đặt ảnh ở trung tâm trang thì thêm cụm <P align=center>
Ví dụ:
<P align=center>
<IMG height=300 src=”http://img233.imageshack.us/img233/3757/ceaf706c093d3a2514abcd3.gif” width=600 border=0></P>
- Nếu ta muốn ảnh đặt ở bên phải thì thêm vào <P align=right>
Ví dụ:
<P align=right><IMG height=300 src=”http://img233.imageshack.us/img233/3757/ceaf706c093d3a2514abcd3.gif” width=600 border=0></P>
- Nếu ta muốn ảnh thoáng trên thoáng dưới thì thêm vào đầu và cuối code  tag <br> (nhiều hay ít, tuỳ)
Ví dụ:
<br><P align=center><IMG height=300 src=”http://img233.imageshack.us/img233/3757/ceaf706c093d3a2514abcd3.gif”  width=600 border=0></P><br><br><br>
2- Định vị chính xác vị trí ảnh:
Để định vị chính xác một ảnh trên trang ta phải lấy một trong hai đường biên của trang làm mốc để từ đó mà căn ảnh.
Ví dụ code post ảnh dưới đây lấy biên phải làm mốc định vị:
<IMG style=”FLOAT: right; MARGIN-RIGHT: 35px; POSITION: relative” height=260 src=”http://i512.photobucket.com/albums/t322/hoacomay_de/_IGP3641.jpg” width=165 border=0> </P>

Ghi chú:
FLOAT: right (căn từ bên phải)
MARGIN-RIGHT: 35px (ảnh cách xa biên phải là 35px)
width=165  height=260 (kích thước của ảnh 165×260)
Nếu ta lấy biên trái làm mốc FLOAT: left thì ta cũng lấy cự ly tính từ biên trái: MARGIN-Left …. px.
Ví dụ ta dán ảnh và định vị ảnh cách biên trái là 60 px:
<IMG style=”FLOAT: left; MARGIN-LEFT: 60px; POSITION: relative” height=260 src=”http://i512.photobucket.com/albums/t322/hoacomay_de/_IGP3641.jpg” width=165 border=0> </P>


st

Posted in: Thiết kế blogspot