 |
| Code Thông Dụng Để Viết HTML |
1. Bookmark đến vị trí nhanh trong bài viết.
<a href="url_bài_viết#Tên_gán_cho_vị_trí ">Nội_dung</a>
<a name="Tên_gán_cho_vị_trí ">Nội_dung</a>
2. Chèn flash vào bài viết.
Cách 1<div style="text-align:center;"><embed wmode=Transparent pluginspage="http://www.macromedia.com/go/getflashplayer" src="LINK_FLASH" width="900" height="300" type="application/x-shockwave-flash" scale="" play="true" loop="true" menu="true"></embed></div>Cách 2
<embed src="LINK_FLASH" bgcolor="#000000" type="application/x-shockwave-flash" allowscriptaccess="none" width="400" height="400"></embed>
LINK_FLASH là địa chỉ URL của flash mà bạn cần chèn vào bài viết
3. Viền khung nội dung vào bài viết
<div style="border: 1px solid #4F4F4F ; padding: 4px; background:#eee; width:400px;">- solid ______________
NỘI_DUNG
</div>
- dashed ----------------
- dotted ......................
Kết Quả:
NỘI_DUNG
4. Chèn nhạc vào bài viết
<object name='hat' width=300 height=45>
<embed type='application/x-mplayer2'
pluginspage='http://www.microsoft.com/Windows/Downloads/Contents/Products/MediaPlayer/'
controls='controlpanel' width=300 height=45 src='LINK_NHẠC'
autostart="0" showstatusbar="0" ShowControls='true' loop='0' name='hat'></embed></object>
Với:
LINK_NHẠC // Phải là link trực tiếp (VD: http://...bài_hát.mp3)
loop='0' // Không lặp lại
loop='1' // Lặp lại một lần
loop='-1' // Lặp lại mãi mãi
autostart="0" // Không tự play
autostart="1" // Play ngay khi web tải xong
5. Tạo button ẩn hiện nội dung
<div><div><input type="button" value="Xem" style="width:75px; font-size:11px; margin:0px; padding:4px; border="1"" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';this.innerText = ''; this.value = 'Ẩn'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Xem'; }">
</div><div><div style="display: none; border:#4F4F4F 1px solid; padding: 4px; background:# ">
NỘI_DUNG
</div></div></div>
KẾT QUẢ
6. Tạo hiệu ứng khi di chuyển chuột vào link liên kết
<a href="LINK" target="blank" onmouseover="oldColor=this.style.backgroundColor;this.style.backgroundColor='#eee';" onmouseout="this.style.backgroundColor=oldColor;">TEN_LINK</a>
7. Canh Giữa, Trái, Phải cho nội dung
<div style="text-align:center;">Nội_dung</div>Với:
Center // Canh Giữa
Right // Canh Phải
Left // Canh Trái
8. In Đậm, In Nghiêng, Gạch Chân, Gạch Ngang:
<b>Nội_dung_in_đậm</b><i>Nội_dung_in_nghiêng</i><u>Nội_dung_gạch_chân</u><strike>Nội_dung_chữ_bị_gạch_ngang</strike>
9. Dấu chấm hoặc số đầu dòng:
Dấu chấm vô dòng con<ul>
<li> Nội_dung 1 </li>
<li> Nội_dung 2 </li>
<li> Nội_dung 3 </li>
</ul>
Đánh số đầu dòng
<ol>
<li> Nội_dung 1 </li>
<li> Nội_dung 2 </li>
<li> Nội_dung 3 </li>
</ol>
10. Chèn Ảnh Vào Bài Viết:
Code đầy đủ:
<img src="LINK_ẢNH" title="Ghi_chú" alt="Mô_tả" align="bottom" width="400" height="400"/>
11: Chèn Link vào bài viết:
<a href="LINK" target="blank">Tên_Link</a>
 |
| Code Thông Dụng Để Viết HTML |
12. Chèn Khung Chứa Code:
<form name="MyTextBoxForm"><input name="button" onclick="javascript:this.form.MyTextBox.focus();this.form.MyTextBox.select();" type="button" value="Select all"/>
<textarea cols="59" name="MyTextBox" rows="18" wrap="on" style="background:#eee; color:#464646; border:1px #A0C4EA dashed;">NỘI_DUNG_CODE</textarea> </form>
13. Thay đổi ảnh khác khi rê chuột vào:
<a href="link_liên_kết" target="blank"><img onmouseover="this.src='LINK_HÌNH_THAY_THẾ'" onmouseout="this.src='LINK_HÌNH'" src="LINK_HÌNH" ></a>
14. Nhúng 1 trang web khác vào bài viết:
<iframe src="LINK_HTML" height="550" width="600" scrolling=yes frameborder="0"></iframe>
15. Cách kiểu định dạng chữ trong lệnh: text-decoration:none
none (Không định dạng)
underline (Gạch đích)
overline (Gạch trên đầu)
line-through (Gạch ngang chữ)
blink (Chớp chớp)
inherit
16. Đổ bóng bo góc:
/*Tạo bóng đổ*/
box-shadow: 8px 8px 8px #616D7E;
-webkit-box-shadow: 8px 8px 8px #616D7E;
-moz-box-shadow: 8px 8px 8px #616D7E;
/*Tạo bóng đổ 4 cạnh*/
box-shadow: 0px 0px 8px #616D7E;
-webkit-box-shadow: 0px 0px 8px #616D7E;
-moz-box-shadow: 0px 0px 8px #616D7E;
/*Bo tròn 4 góc viền*/
border-radius:4px;
/*Bo tròn tùy chọn: top, right, bottom, left*/
border-radius:4px 4px 4px 4px;
17. Cách loại list trong lệnh: ul {list-style-type:none;}
none: Không hiển thị đánh dấu
disc: Chấm vuông
circle: Chấm tròn trắng
square: Chấm tròn đen
decimal: Kiểu số (1,2,3,4,…)
lower-alpha: Kiểu Alphabet ở dạng in thường (a, b, c, d, e, …)
upper-alpha: Kiểu Alphabet ở dạng in hoa (A, B, C, D, E, …)
lower-roman: Kiểu La Mã ở dạng thường (i, ii, iii, iv, v, …)
upper-roman: Kiểu La Mã ở dạng in hoa (I, II, III, IV, V, …)
18. Các lệnh lặp ảnh trong lệnh: background: url(image) repeat
repeat: lặp ảnh
repeat-y: lặp ảnh theo chiều dọc (từ trên xuống)
repeat-x: lặp ảnh theo bề ngang (từ trái qua)
no-repeat: không lặp
top: đặt ảnh trên mép cùng
top right: đặt ảnh mép trên cùng góc phải
top left: đặt ảnh mép trên cùng góc trái
bottom: đặt ảnh mép dưới cùng
bottom left: đặt ảnh mép dưới cùng góc trái
bottom right: đặt ảnh mép dưới cùng góc phải
right: đặt ảnh bên mép phải
left: đặt ảnh bên mép trái
center: đặt ảnh ở vị trí giữa
19. Các lệnh điều kiện trong HTML
19.1. Điều kiện ở trang chủ
<b:if cond='data:blog.url == data:blog.homepageUrl'>
...
</b:if>
19.2. Điều kiện ở trang bài viết
<b:if cond='data:blog.pageType == "item"'>
...
</b:if>
19.3. Điều kiện ở trang chủ, trang nhãn
<b:if cond='data:blog.pageType == "index"'>
...
</b:if>
19.4. Điều kiện ở các trang lưu trữ
<b:if cond='data:blog.pageType == "archive"'>
...
</b:if>
19.5. Điều kiện ở các trang tĩnh
<b:if cond='data:blog.pageType == "static_page"'>
...
</b:if>
19.6. Điều kiện ở một trang riêng biệt nào đó
<b:if cond='data:blog.url == "URL_của_trang_riêng_biệt"'>
...
</b:if>
Nếu thay == thành != thì kết quả sẽ ngược lại - Nghĩa là sẽ loại trừ trang đặt điều kiện ra và lấy phần ngược lại (các trang còn lại)
Ví dụ: Điều kiện loại trừ trang bài viết
<b:if cond='data:blog.pageType != "item"'>
...
</b:if>
28. Thêm chữ ký hay ghi chú dưới mỗi bài viết (Đặt dưới dòng <data:post.body/>)
<!-- Lời ghi dưới mỗi bài viết -->
<b:if cond='data:blog.pageType == "item"'>
Nội_dung
</b:if>
Nội_dung // Ghi chú nội dung của bạn, có thể dùng hình ảnh, màu chữ, canh lề,v.v..
29. Script chèn file .js vào blog
<script src='Link_File_JS' type='text/javascript'/>
30. Script chèn trực tiếp nội dung file .js vào blog
<script type='text/javascript'>
//<![CDATA[
Nội_dung_file_js
//]]>
</script>
30. Chữ nhỏ bên dưới ( dùng để viết công thức toán học )
X<sub>1</sub>X<sup>1</sup>
Kết quả
X1
X1
