Tải bản đầy đủ (.doc) (5 trang)

Tài liệu Chèn bảng vào blog doc

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (99.85 KB, 5 trang )

Chinh phục Yahoo blog.Topic 3: Level Up !
Topic 3: Level Up !
1. Chèn bảng vào blog
Để trình bày nội dung blog thì đôi lúc bạn cần tới bảng (table).
Row 1 col 1 Row 1 col 2-3
Row 2 col 1
Row 2 col 2
Row 2 col 3
Row 3 col 1 Row 3 col 3
Với cái bảng như trong hình minh họa sẽ có đoạn code HTML như
sau:
<table bgcolor="#aa00bb" border="2" cellpadding="30"
cellspacing="3">
<tbody>
<tr>
<td>Row 1 col 1</td>
<td colspan="2" align="center">Row 1 col 2-3</td>
</tr>
<tr>
<td>Row 2 col 1</td>
<td rowspan="2" align="top">Row 2 col 2</td>
<td>Row 2 col 3</td>
</tr>
<tr>
<td>Row 3 col 1</td>
<td>Row 3 col 3</td>
</tr>
</tbody>
</table>
Việc chèn bảng cũng hết sức đơn giản, bạn edit một entry, chọn
“View HTML Source” như bước chèn hình ảnh, rồi cứ copy đoạn mã


HTML trên và paste vào HTML của entry xem sao nhé. Bỏ chọn "View
HTML" để xem table sẽ hiển thị như thế nào. Mình sẽ giải thích các
thuộc tính của nó ngay sau đây.
Thuộc tính border = 2 trong tag <table> chỉ thị cho browser vẽ một
đường viền quanh bảng với độ dày là 2 điểm. Mỗi hàng được xác
định bởi tag Table Row là <tr>…<tr>, rồi sau đó mỗi phần tử trong
hàng được định nghĩa bởi tag Table Data là <td>…</td>. Trong mỗi
tag <td> <td> bạn có thể chèn bất kỳ loại tag nào của HTML (văn
bản, hình ảnh,…). Trong tag Table Data bạn lưu ý tới một số thuộc
tính để điều chỉnh sự canh lề của các thông tin được thêm vào trong
đó.
Chỉnh lề theo chiều ngang Chỉnh lề theo chiều dọc
<td align = left> Sắp xếp tất cả các
thành phần về bên trái của ô – cell.
(mặc định)
<td valign = top> Sắp xếp tất cả
các thành phần từ đỉnh ô xuống
dưới
<td align = right> Sắp xếp tất cả các
thành phần về bên phải của ô
<td valign = bottom> Sắp xếp tất
cả các thành phần từ dưới ô lên
trên
<td align = center> Sắp xếp tất cả <td valign = middle> Sắp xếp tất
các thành phần vào giữa ô.
cả các thành phần ở giữa ô (mặc
định
Bạn có thể kết hợp các thuộc tính này lại với nhau: <td align = left
valign=top>, khi đó các thành phần sẽ hiển thị dọc bên trái và từ trên
xuống.

Các ô trong bảng được bắt đầu từ trái qua phải và từ trên xuống
dưới. Bạn để ý chắc sẽ thấy thuộc tính colspan và rowspan giúp
chúng dàn ô theo chiều thẳng đứng và chiều ngang so với các ô
khác trong bảng. Chẳng hạn ở ô “Row 1 col 2-3”, thì ô ở dòng 1 và
chiếm chiều ngang là 2 cột (cột 2 và cột 3) khi đó thuộc tính colspan
=2. Tương tự ở ô “Row 2 col 2” thì ô ở dòng 2 cột 2 và chiếm chiều
thẳng đứng là 2 hàng (hàng 2 và hàng 3) khi đó rowspan = 2.
Thủ thuật bảng là ở đây nè, bạn thấy không,
mọi thứ nằm trong bảng và bạn muốn blog
của mình đẹp hơn phải không. Hơn nữa bạn
nào thường edit theme sẽ thấy được sự hữu
ích của bảng, đó là khi bạn cho mọi thứ vào
trong bảng rùi thì cứ thoải mái mà chọn màu
chữ và tô màu cho chữ mà không sợ nó trở
thành một đám loạn sắc khi thay đổi màu nền
của blog.Tiếp tục theo dõi các bài viết của mình nhé
"Cuộc sống cứ đổi thay, ta mong sao mình lớn lên từng ngày.
Mỗi bước ta đi luôn chứa đựng niềm tin yêu của bạn bè, hạnh
phúc nhỏ bé, nhưng ta không thể ôm hết vào lòng, bởi xung
quanh ta luôn có những người bạn khác cần ta chia sẽ."
ITS.
Để có được một cái bảng như trên thì bạn edit một entry. Chọn
“View HTML Source”, copy đoạn mã HTML bên dưới, rồi paste vào
entry của bạn.
<table align="center"
background=" />ron.gif" bgcolor="#ffffff" border="0" cellpadding="40"
cellspacing="0"><tbody><tr><td><table align="center"
bgcolor="#ffffff" border="1" cellpadding="20"
cellspacing="5"><tbody><tr><td
background=" />noel.gif" bgcolor="#ffffff"><h3>Welcome to ITS' blog ! Have a good

time. Edit this entry in your blog.</h3> <p></p>
</td></tr></tbody></table></td></tr></tbody></table>
Bỏ chọn “View HTML Source”, thấy gì chưa nào ? Chỉnh sửa lại
bảng theo ý của bạn nhé. Chọn lại “View HTML Source”, nếu bạn
không muốn tạo hình nền cho bảng thì bỏ thuộc tính background đi
nhé. Nhưng chắc là bạn muốn entry của mình đẹp hơn mà, bạn
muốn thay đổi background thì chỉ việc kiếm cái hình nào đẹp, up nó
lên một hosting image. (Việc up hình lên bạn đọc hướng dẫn ở Topic
2 nhé). Sau đó bạn copy cái URL của hình bạn vừa up lên. Ví dụ ở
photobucket thì bạn chọn URL như hình 3.1.
Hình 3.1 – Copy URL của hình.
Xóa URL củ của hình trong background=" ",sau đó paste URL của
hình mới vào. Bạn có thể thay đổi background ở cả tag table và td. Ở
trong bảng thì bạn cứ việc edit như trên một entry bình thường
(canh lề, chèn hình ….).
2. Tạo nhạc nền
Nhắm mắt copy đoạn code HTML sau về nghe tạm đã nghe. Chọn
"View HTML Source" paste vào, save thế là xong. Giải thích cụ thể
sau. Mà chắc là không có gì để nói nhiều, chỉ nói cái chiện nghe
nhạc từ Youtube thui (lúc được lúc không cho nên mới đang xem xét
lại, ITS nghĩ là do Bit rate, hi hi). Mà qui ước luôn ha, lần sau nghe
nhắc tới copy code HTML thì cứ chọn "View HTML Source" nhé. Cứ
5 entry đặt một nhạc nền (chứ không là nghe tranh tấu đó), và để
"sớm nghe được" nhạc nền thì nên copy đoạn code trên paste vào
trên cùng của entry mới nhất.
Love you and love me.(Lượm trên google .)
<embed src=" />6149162938955616131&amp;hl=pl" type="application/x-shockwave-
flash" wmode="transparent" flashvars="autoplay=1&amp;loop=1"
allowscriptaccess="none" height="1" width="1">
Jingle Bell - Boney M. (youtube > live < tested by ITS)

<embed src="
type="application/x-shockwave-flash" wmode="transparent"
flashvars="autoplay=1&amp;loop=1" allowscriptaccess="none"
height="1" width="1">
Thursday November 30, 2006 - 09:58pm (ICT) Permanent Link | 8 Comments
Chinh phục Yahoo blog.Topic 2: Nâng cấp blog .

×