Trang chủ > Diễn đàn > Lập trình HTML & Javascript

Nội quy diễn đàn

Thảo luận tại “Quy định và hướng dẫn tham gia diễn đàn” bởi mcneil, 22.07.2012

Trạng thái chủ đề: Thảo luận

vknyckp user: Tham gia ngày: 09.03.2015
Ngày gửi: 28.04.2015
Bài gửi: 59
Xem: 17,327; Bạn thích bài viết này?

Bạn muốn quảng cáo bài viết này lên Top kết quả tìm kiếm Google? Xem chi tiết dịch vụ seo từ khóa (Aliofiot Ads)

29 mã code thông dụng trong viết HTML

Tag: 29 ma code thong dung trong viec viet html | nhung ma code thong dung dung trong htnl | nhung ma code co ban trong viec viet html | code thong dung trong html

Code Thông Dụng Để Viết HTML thông dụng để viết blogspot, nền tảng HTML đã quá phổ biến cho nên biết Code Thông Dụng Để Viết HTML này là cần thiết

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><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

<divmargin: 0px; padding: 0px; border: 0px none; font-family: inherit; font-style: inherit; font-variant: inherit; font-weight: 700; line-height: inherit; font-stretch: inherit; font-size: 15px; vertical-align: baseline;">solid #4F4F4F ; padding: 4px; background:#eee; width:400px;">
NỘI_DUNG
</div>

- solid ______________
- 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"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>
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

<divmargin: 0px; padding: 0px; border: 0px none; font-family: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; font-stretch: inherit; font-size: 15px; vertical-align: baseline; color: red;">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>

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">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/>)

<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>

Báo vi phạm (0)