Chủ Nhật, 26 tháng 5, 2013

CODE TẠO HÌNH NỀN VÀ CHIA CỘT CHO BÀI VIẾT BLOG

CODE

<table border="2" cellpadding="0" cellspacing="0" style="border: 0.5px solid #ff0000; height: 200px; width: 500px;"><tbody>
<tr> <td background="LINK HÌNH CỦA BẠN" style="padding: 15px;">

NỘI DUNG BÀI BLOG        

</td> </tr>
</tbody></table>


Thay link hình của ban vào (màu đỏ)
Điều chỉnh height và width tương ứng


Viết nội dung vào (màu xanh)
Code 2
<table width="600" cellspacing="0" cellpadding="0" style="border:1px solid #000000">
<tr>
<td style="padding: 15px" background="link hình nền"> 
<font face="Tahoma,Times New Roman,Arial" size="2" color="#000">

Nội dung bài viết ghi ở đây

</font></td></tr></table>



  
Code 3
<div style="width:100%; background:url(XXXXX) ">
    <table width="100%" border="0" cellspacing="5" cellpadding="10">
    <tr>
    <td>

    Nội dung bài viết

    </td>
    </tr>
    </table>
    </div>
Khung hình nền có 1 dòng và 2 cột


CODE

<table border="2" width="200"
 height=
"200" cellspacing="0" cellpadding=
"0" style=
"border:0.5px solid #ff0000">
<tr>
<td style="padding: 15px"
background=
"lINK HÌNH">

NỘI DUNG BÀI BLOG1

</td>

<td style="padding: 15px" background="LINK HÌNH CỦA BẠN">

NỘI DUNG BÀI BLOG2

</td>
</tr>


Các bạn thay width,heiht,
border các giá tri tương ứng                                            

Thay link hình của bạn

Viết nội dung Blog theo 2 cột           

Code khung ảnh nền
<table style="height: 132px;" align="left" background="Thay link ảnh nền" border="2" cellpadding="5" cellspacing="3"> <tbody> <tr> <td align="left"> <font style="font-family: Times New Roman,Times,serif;" size="1"><font size="2">Viết nội dung ở đây</font> </font><p></p>
</td></tr></tbody></table>


Code chia cột
CHIA 2 CỘT BO KHUNG



<table border="1" style="width: 600px" > <tr>

<td style="width: 350px;text-align:left;">

<img src="Link Icom"><a href="Liên kết tới bài viết 1">Tiêu đề bài viết 1</a><br>

<img src="Link Icom"><a href="Liên kết tới bài viết 2">Tiêu đề bài viết 2</a><br> </td>

<td style="width: 350px;text-align:left;"> <img src="Link Icom"><a href="Liên kết tới bài viết 3">Tiêu đề bài viết 3</a><br>

<img src="Link Icom"><a href="Liên kết tới bài viết 4">Tiêu đề bài viết 4</a><br> </td>

CHIA 3 CỘT BO KHUNG

<table border="1" style="width: 600px" > <tr>

<td style="width: 200px;text-align:left;"" valign="top"> Nội dung cột 1 </td>

<td style="width: 200px;text-align:left;"" valign="top"> Nội dung cột 2 </td>

<td style="width: 200px;text-align:left;"" valign="top"> Nội dung cột 3 </td> </tr> </table>


Code chia 2 cột bằng nhau
<table border="1" style="width: 600px"  >
  <tr>
    <td style="width: 350px;text-align:left;""  valign="top">
        Nội dung cột 1
    </td>
    <td  style="width: 350px;text-align:left;"" valign="top">
        Nội dung cột 2
    </td>
  </tr>
</table>

Chia 4 cột
code
<table border="0" style="width: 540px;"><tbody>
<tr>     <td style="text-align: left; width: 260px;" valign="top">
<table border="1" style="width: 260px;"><tbody>
<tr>     <td style="text-align: left; width: 110px;" valign="top">
Nội dung cột 1</td>     <td style="text-align: left; width: 160px;" valign="top">
Nội dung cột 2</td>   </tr>
</tbody></table>
</td>     <td style="text-align: left; width: 260px;" valign="top">
<table border="1" style="width: 260px;"><tbody>
<tr>     <td style="text-align: left; width: 110px;" valign="top">
Nội dung cột 3</td>     <td style="text-align: left; width: 160px;" valign="top">
Nội dung cột 4</td>   </tr>
</tbody></table>
</td>   </tr>
</tbody></table>
Hiển thị


Nội dung cột 1

Nội dung cột 2


Nội dung cột 3

Nội dung cột 4
chia 4 cột code 2
<table border="1" style="width: 540px;"><tbody>
<tr>     <td style="text-align: left; width: 260px;" valign="top">
<table border="0" style="width: 260px;"><tbody>
<tr>     <td style="text-align: left; width: 110px;" valign="top">
Nội dung cột 1</td>     <td style="text-align: left; width: 140px;" valign="top">
Nội dung cột 2</td>   </tr>
</tbody></table>
</td>     <td style="text-align: left; width: 260px;" valign="top">
<table border="0" style="width: 260px;"><tbody>
<tr>     <td style="text-align: left; width: 110px;" valign="top">
Nội dung cột 3</td>     <td style="text-align: left; width: 140px;" valign="top">
Nội dung cột 4</td>   </tr>
</tbody></table>
</td>   </tr>
</tbody></table>

Hiển thị


Nội dung cột 1

Nội dung cột 2


Nội dung cột 3

Nội dung cột 4

Bài viết liên quan
Tạo khung cho bài viết
Đóng khung và chia cột cho bài viét
Hiển thị code chèn hình
CHÚ Ý 
Nếu không phải là hình nền  phải chỉnh kích cở trước
Bạn phải vào chế độ xem trước mới thấy hình 


Không có nhận xét nào :