HTML cơ bản (phần 1)
♥Blueteen♥
Chào mừng bạn đã đến với Diễn Đàn phong cách xì teen nhất Việt Nam BlueTeen.Chúc các bạn có một ngày thật là vui vẻ
♥Blueteen♥
Chào mừng bạn đã đến với Diễn Đàn phong cách xì teen nhất Việt Nam BlueTeen.Chúc các bạn có một ngày thật là vui vẻ

:: Quên mật khẩu? ::

Chào mừng các bạn đến với diễn đàn
» Nếu đây là lần đầu tiên bạn tham gia diễn đàn, xin mời bạn xem phần hướng dẫn để biết cách dùng diễn đàn.
» Để có thể tham gia thảo luận, các bạn phải đăng ký làm thành viên. Bấm vào để đăng ký.


Welcome to www.blueteen.tk Have an account?Register

Share|

HTML cơ bản (phần 1)

Xem chủ đề cũ hơn Xem chủ đề mới hơn Go down
Tác giảThông điệp
Leo map Việt Nam
administrator
Ban Quản Trị
Ban Quản Trị
administrator
Danh Hiệu : Thần Thoại
Tâm trạng : nhin caigi
posts : 139
points : 146032
thanked : 0
Ngày sinh : 06/10/1996

Ngày tham gia : 05/04/2012
Tuổi : 27
Đến từ : sơn tây-hà nội
Status : lalala
Hiện đang :
Bài gửi
Viết vào lúc : Wed Apr 11, 2012 10:52 am


Tiêu đề : HTML cơ bản (phần 1)

Mình làm forum cũng được hơn 1 tuần rồi.Mình được Admin ở đây giúp đỡ rất nhiệt tình nên muốn vào đây cống hiến 1 phần sức lực cho forum ngày càng phát triển hơn.
BÀI 1:HTML cơ bản
Chú ý nếu bạn vẫn thấy xuất hiện 1 số từ tiếng Anh - đó là do chúng tôi không tìm được từ tiếng Việt tương ứng, việc dịch thẳng sang tiếng Việt sẽ làm giảm sự ý nghĩa và làm cho tài liệu khó hiểu hơn. bạn nên tiếp tục đọc thêm các đọan kế sẽ dần hiểu rõ ý nghĩa của từ tiếng Anh tương ứng.

Một file có định dạng HTML là gì?


- HTML là chữ viết tắt của Hyper Text Markup Language (Ngôn ngữ hiển thị
siêu văn bản).


- Một file HTML là một file text bao gồm những tag nhỏ


- Những tag hiển thị nói cho trình duyệt biết nó phải hiển thị trang đó
như thế nào


- Một file HTML phải có phần mở rộng là .htm hoặc .html


- Một file HTML có thể được tạo bởi một trình soạn thảo đơn giản.


Bạn có muốn thử không?


Nếu bạn sử dụng Window hãy mở Notepad, nếu bạn sử dụng Mac mở ứng dụng
Simple Text. Với OSX bạn mở TextEdit và thay đổi lựa chọn sau: Select (trong
cửa sổ preference) > Plain Text thay vì Rich Text và chọn "Ignore rich
text commands in HTML files". Việc này rất quan trọng bởi vì nếu bạn
không làm vậy thì code HTML có thể không đúng.


Sau đó bạn gõ vào những dòng sau:
Code:

<html>

<head>

<title>Viet Photoshop</title>

</head>

<body>

teenblue.tk  and
teenblue.tk. <b>Photoshop and web design resources </b>

</body>

</html>

Lưu file lại với tên là "mypage.htm" vào desktop cũng được. Sau đó
bạn đóng trình soạn thảo Notepad hoặc Simple Text lại và tìm đến file
mypage.htm ở desktop rồi nhấp đúp vào trình duyệt sẽ hiển thị nội dung
của trang.



Giải thích ví dụ trên:


Thẻ đầu tiên trong tài liệu HTML là .
Thẻ này nói cho trình duyệt biết đây là điểm khởi đầu của một tài liệu
HTML. Thẻ cuối cùng của tài liệu là , thẻ này nói cho trình duyệt
biết đây là điểm kết thúc của văn bản.



Đoạn chữ nằm giữa hai thẻ và là thông tin của header.
Thông tin header sẽ không được hiển thị trên cửa sổ trình duyệt.


Đoạn chữ nằm giữa cặp thẻ là tiêu đề của văn bản. Dòng tiêu đề<br />này sẽ xuất hiện ở thanh trạng thái của trình duyệt web.<br /><br />Đoạn chữ nằm giữa hai thẻ <body> là những gì nó sẽ thể hiện trên trình<br />duyệt của bạn.<br /><br /><br /><br />Đoạn chữ nằm giữa hai thẻ <b> và </b> sẽ xuất hiện dưới dạng đậm<br /><br /><br /><br />Phần mở rộng là HTM hay HTML?<br /><br /><br />Khi bạn lưu một văn bản dưới dạng HTML, bạn có<br />thể sử dụng cả hai dạng là .htm và .html. Chúng ta đã sử dụng dạng .htm<br />trong ví dụ trên. Lý do này bắt nguồn từ nguyên nhân ngày trước là có<br />những phần mềm chỉ cho phép phần mở rộng có tối đa là 3 chữ cái. Với<br />những phần mềm mới hiện nay chúng ta nghĩ sẽ tốt hơn nếu bạn lưu lại với<br />phần mở rộng là .html<br /><br /><br /><br />Một chú ý khi sử dụng trình soạn thảo HTML:<br /><br /><br />Bạn có thể dễ dàng chỉnh sửa một tài liệu HTML<br />bằng cách sử dụng WYSIWYG (what you see is what you get = thấy gì có đó)<br />như là Frontpage, Claris Homepage, Dream weaver hoặc Adobe PageMill thay<br />vì bạn phải tự viết những cặp thẻ từ đầu đến cuối. Nhưng nếu bạn muốn<br />trở thành một web master đầy kỹ thuật, tôi khuyên bạn nên sử dụng những<br />trình soạn thảo text đơn giản để học và làm quen với cấu trúc câu lệnh<br />của HTML.<br /><br /><br /><br />Những câu hỏi thường gặp<br /><br /><br />Q: Sau khi tôi đã chỉnh sửa một file<br />HTML, nhưng tôi không thể xem được kết quả ở trình duyệt. Tại sao vậy?<br /><br />A: Bạn phải chắc rằng bạn đã lưu file đó với phần mở rộng là .htm<br />hoặc .html, như ở ví dụ trên là mypage.htm.<br /><br /><br />Q: Tôi đã thử chỉnh sửa file HTML của<br />tôi nhưng lại không thấy thay đổi gì ở trình duyệt cả. Tại sao vậy?<br /><br />A: Trình duyệt tự động cach trang của bạn do đó nó không phải đọc<br />cùng một trang hai lần. Khi bạn thay đổi gì đó ở một trang, trình duyệt<br />nó không thể nhận ra được những thay đổi đó. Sử dụng nút refresh hoặc<br />reload của trình duyệt để bắt nó đọc lại những thay đổi bạn tạo ra.<br /><br /><br />Q: Tôi nên sử dụng trình duyệt nào?<br /><br />A: Bạn có thể thực tập tất cả những bài thực hành trong phần này<br />với những trình duyệt thông dụng như Internet Explorer, Mozilla,<br />Netscape hoặc Opera. Tuy nhiên, một vài ví dụ trong phần nâng cao đòi<br />hỏi bạn phải có phiên bản mới nhất của trình duyệt.<br /><br /><br />Q: Tôi bắt buộc phải sử dụng Window sao?<br />còn Mac thì sao?<br /><br />A: Bạn có thể thực tập tất cả những bài thực hành trong phần này<br />với hệ điều hành không phải là Windows như Mac. Tuy nhiên một vài ví dụ<br />trong phần nâng cao đòi hỏi bạn phải có phiên bản mới hơn của Windows,<br />như là Window98 hoặc Windows 2000.<br /><br /><br />Thành phần của HTML<br /><br /><br /><br />Các dạng thẻ HTML<br /><br /><br /><br /> Thẻ HTML dùng để viết lên những thành tố HTML<br /><br /><br /><br /> Thẻ HTML được bao quanh bởi hai dấu lớn hơn < và > nhỏ hơn.<br /><br /><br /><br /> Những thẻ HTML thường có một cặp giống như <b> và </b><br /><br /><br /><br /> Thẻ thứ nhất là thẻ mở đầu và thẻ thứ hai là thẻ kết thúc.<br /><br /><br /><br /> Dòng chữ ở giữa hai thẻ bắt đầu và kết thúc là nội dung.<br /><br /><br /><br /> Những thẻ HTML không phân biệt in hoa và viết thường, ví dụ dạng <b> và<br /> <B> đều như nhau,<br /><br /><br />Thành phần HTML<br />Nhớ lại ví dụ ở trên của chúng ta về HTM</div><div class="clear"></div><!-- google_ad_section_end --></td><td style="padding: 0px" background="http://www.fileden.com/files/2009/2/13/2319435/admin_15.gif"></td></tr><tr><td style="padding: 0px"><img src="https://2img.net/h/www.fileden.com/files/2009/2/13/2319435/admin_16.gif"></td><td style="padding: 0px" background="http://www.fileden.com/files/2009/2/13/2319435/admin_17.gif"></td><td style="padding: 0px"><img src="https://2img.net/h/www.fileden.com/files/2009/2/13/2319435/admin_18.gif"></td></tr></table></div><div class="clear"></div> <div class="signature_div"</div> </div><span class="gensmall"></span></td></tr></table></td></tr><tr><td class="row1 browse-arrows" align="center" valign="middle" width="150"><a href="#top"><img class="sprite-arrow_prosilver_up" src="https://2img.net/i/empty.gif" alt="Về Đầu Trang" loading="lazy" /></a> <a href="#bottom"><img class="sprite-arrow_prosilver_down" src="https://2img.net/i/empty.gif" alt="Go down" loading="lazy" /></a></td><td class="row1 messaging gensmall" width="100%" height="28"><table border="0" cellspacing="0" cellpadding="0"><tr><td valign="middle"> <a href="http://www.blueteen.tk" title="Website của thành viên này" target="_blank" rel="nofollow"><img src="https://2img.net/i/fa/prosilver/icon_contact_www.gif" alt="http://www.blueteen.tk" /></a> </td></tr></table></td></tr><tr align="right"><td class="catBottom" colspan="3" height="28"><table width="100%" border="0" cellspacing="0" cellpadding="0"><tr><td width="9%" class="noprint"> </td><td align="center" class="t-title"><a name="bottomtitle"></a><h1 class="cattitle">HTML cơ bản (phần 1)</h1></td><td align="right" nowrap="nowrap" width="9%" class="browse-arrows"><a href="/t13p-topic"><img class="sprite-arrow_prosilver_left" src="https://2img.net/i/empty.gif" alt="Xem chủ đề cũ hơn" loading="lazy" /></a> <a href="/t13n-topic"><img class="sprite-arrow_prosilver_right" src="https://2img.net/i/empty.gif" alt="Xem chủ đề mới hơn" loading="lazy" /></a> <a href="#top"><img class="sprite-arrow_prosilver_up" src="https://2img.net/i/empty.gif" alt="Về Đầu Trang" loading="lazy" /></a> </td></tr></table></td></tr></table><table class="forumline" width="100%" border="0" cellpadding="1" cellspacing="0" id="ptrafic_close" style="display:none;margin: 1px 0px 1px 0px"><tr><td class="thead" height="28"><table width="100%" border="0" cellspacing="0" cellpadding="0"><tr><td valign="top"><h1> Xem thêm các bài viết khác cùng chuyên mục</h1></td><td align="right" valign="middle" width="10"><span class="gensmall"><a onmouseover="showtip('Mở danh mục');" onmouseout="hidetip();" href="javascript:ShowHideLayer('ptrafic_open','ptrafic_close');"><img class="sprite-tabs_more" src="https://2img.net/i/empty.gif" alt="+" align="middle" border="0" /></a></span></td></tr></table></td></tr></table><table class="forumline" width="100%" border="0" cellpadding="1" cellspacing="0" id="ptrafic_open" style="display:'';margin: 1px 0px 1px 0px"><tr><td class="thead" height="28"><table width="100%" border="0" cellspacing="0" cellpadding="0"><tr><td valign="top"><h1> Xem thêm các bài viết khác cùng chuyên mục</h1></td><td align="right" valign="middle" width="10"><span class="gensmall"><a onmouseover="showtip('Đóng danh mục');" onmouseout="hidetip();" href="javascript:ShowHideLayer('ptrafic_open','ptrafic_close');"><img class="sprite-tabs_less" src="https://2img.net/i/empty.gif" alt="-" align="middle" border="0" /></a></span></td></tr></table></td></tr><tr><td class="row2 postbody" valign="top"><script type="text/javascript">$(function() {$('<span class="bv" />').load('/f28-forum div.topictitle:not("div.topictitle:contains(\'Thông báo khẩn\'),div.topictitle:contains(\'Thông báo\'),div.topictitle:contains(\'Chú ý\'),div.topictitle:gt(13)")', {limit: 10}, function() {jQuery(this).hide().appendTo('.cungchuyenmuc').fadeIn(1);});return false;});</script><div class="cungchuyenmuc" style="overflow:hidden; width:100%; height:auto;"></div></td></tr></table><table class="forumline noprint" width="100%" border="0" cellspacing="0" cellpadding="0"><tr><td class="row2" valign="top" colspan="2" width="150"><span class="gensmall">Trang <strong>1</strong> trong tổng số <strong>1</strong> trang</span></td></tr><tr><td class="row2" colspan="2" align="right" valign="top"><span class="gensmall"></span></td></tr><tr><td class="row2" colspan="2" align="center" style="padding:0px"><center><font color="#00ff66" size="2"><div><b><font color="green">* Không sử dụng ngôn ngữ thiếu văn hoá</b></font></div><div><b><font color="green">* Bài viết sưu tầm nên ghi rõ nguồn.</b></font></div><div><b><font color="green">* Tránh spam nhảm những chủ đề không liên quan.</b></font></div></font></center><b><center><font color="#ff0000" size="2"></b><b><div>* Yêu cầu viết tiếng Việt có dấu trên toàn bộ diễn đàn.</div></b><a name="quickreply"></a></td></tr><tr><td style="margin:0; padding: 0;" colspan="2"><table border="0" cellpadding="0" width="100%" cellspacing="0" id="info_open" style="display:''"><tbody><tr><td class="row2" valign="top" width="25%"><span class="gensmall"><strong>Permissions in this forum:</strong></span></td><td class="row1" valign="top" width="75%"><span class="gensmall">Bạn <strong>không có quyền</strong> trả lời bài viết<br /></span></td></tr><tr><td class="catBottom" colspan="2" height="28"><table width="100%" border="0" cellspacing="0" cellpadding="0"><tr><td valign="middle" width="100%"><span class="nav"><a class="nav" href="/forum">♥Blueteen♥</a><a class="nav" href=""></a> :: <a href="/f28-forum" class="nav"><span>Góc học tập</span></a></span></td><td align="right" valign="middle"><span class="gensmall"><a href="javascript:ShowHideLayer('info_open','info_close');"><img class="sprite-tabs_less" src="https://2img.net/i/empty.gif" alt="-" align="middle" border="0" /></a></span></td></tr></table></td></tr></tbody></table></td></tr><tr><td style="margin:0; padding: 0;" colspan="2"><table border="0" cellpadding="0" cellspacing="0" width="100%" id="info_close" style="display:none;"><tbody><tr><td class="catBottom" colspan="2" height="28"><table width="100%" border="0" cellspacing="0" cellpadding="0"><tr><td valign="middle" width="100%"><span class="nav"><a class="nav" href="/forum">♥Blueteen♥</a><a class="nav" href=""></a> :: <a href="/f28-forum" class="nav"><span>Góc học tập</span></a></span></td><td align="right" valign="middle"><span class="gensmall"><a href="javascript:ShowHideLayer('info_open','info_close');"><img class="sprite-tabs_more" src="https://2img.net/i/empty.gif" alt="+" align="middle" border="0" /></a></span></td></tr></table></td></tr></tbody></table></td></tr></table><form action="/viewforum" method="get" name="jumpbox" onsubmit="if(document.jumpbox.f.value == -1){return false;}"><table class="noprint" width="100%" border="0" cellspacing="2" cellpadding="0" align="center"><tr><td align="left" valign="middle" nowrap="nowrap" ><span class="nav"></span></td></tr></table></form><script type="text/javascript">//<![CDATA[ $(resize_images({ 'selector' : '.postbody', 'max_width' : 500, 'max_height' : 500 }));//]]></script><script src="https://illiweb.com/rs3/86/frm/addthis/addthis_widget.js" type="text/javascript"></script></td><td valign="top" width="180"><div id="right"><table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0"><tr><td class="catLeft" height="25"><span class="genmed module-title"></span></td></tr><tr><td class="row1 genmed" align="left"> <a href="blueteen.tk/forum"><img src="https://2img.net/h/nm4.upanh.com/b6.s27.d2/d4ab5afad502bb194d2a94e5a35223ce_45191584.94db230f2d1a7bcf263114f042a.gif" border="0"></a> <object width="190" height="400"> <param name="movie" value="http://www.nhaccuatui.com/l/Cbl1dPeMhmMs" /> <param name="quality" value="high" /> <param name="wmode" value="transparent" /> <param name="allowscriptaccess" value="always" /> <param name="flashvars" value="&autostart=false" /> <embed src="http://www.nhaccuatui.com/l/Cbl1dPeMhmMs" flashvars="target=blank&autostart=false" allowscriptaccess="always" quality="high" wmode="transparent" type="application/x-shockwave-flash" width="190" height="400"></embed></object>></embed></object> <a href="http://www.blueteen.tk"><img src="https://2img.net/h/nm1.upanh.com/b6.s27.d2/7a15c1e4b123e71afb12c6108aa6b875_45191591.a5050ae1a04852705a6ce0e7f5f.gif" border="0"></a> <a href="ads.ketnoitatca.net/"><img src="https://2img.net/h/nm5.upanh.com/b1.s29.d4/53e88946c56e33176d0a95d7873a4867_45191585.9a1b67b23a71242deb9bc5061ec.jpg" border="0"></a> <a href="http://coithienthai.net/"><img src="https://2img.net/h/nm7.upanh.com/b2.s29.d3/f5082a993362781d9bc81438a60fecae_45191587.smsclip.gif" border="0"></a> <a href="http://ketnoitatca.net/"><img src="https://2img.net/h/nm2.upanh.com/b5.s1.d4/30c50ad709017efac1a5f7da57b00bc6_45191592.mukntc200x300.gif" border="0"></a> <a href="blueteen.tk/h23-page"><img src="https://2img.net/h/nm9.upanh.com/b3.s26.d1/084c629aeb1cda0423d133e909009cbf_45191589.714037d42b003f5342a78772a5a.gif" border="0"></a> <a href="http://www.blueteen.tk/forum"><img border="0" src="http://cc.amazingcounters.com/counter.php?i=3078165&c=9234808" alt="Blue"></a><br><a href="http://www.blueteen.tk">Bạn là người truy cập thứ</a></div></td></tr></table><div style="height: 1px"></div></div></td></tr></tbody></table></div></div><!-- close div id="page-body" --><div id="page-footer"><div align="center"><div class="gen"><strong><a href="http://www.forumvi.com/create-forum/phpbb3" target="_blank">Free forum</a></strong> | <span class="gensmall">©</span><a href="https://www.forumvi.com/phpbb" target="_blank">phpBB</a> | <a name="bottom" href="https://help.forumotion.com/" target="_blank">Free forum support</a> | <a href="/abuse?page=%2Ft13-topic&report=1" rel="nofollow">Báo cáo lạm dụng</a> | <strong><a href="/latest" target="_blank">Thảo luận mới nhất</a></strong></div></div></div></td></tr></table><script type="text/javascript">//<![CDATA[ fa_endpage();//]]></script><script type="text/javascript"> var vglnk = { key: '9019de09e2fbd24ca1be00a9fededd9e' }; (function(d, t) { var s = d.createElement(t); s.type = 'text/javascript'; s.async = true; s.src = '//cdn.viglink.com/api/vglnk.js'; var r = d.getElementsByTagName(t)[0]; r.parentNode.insertBefore(s, r); }(document, 'script')); </script> <script type="text/javascript">window._taboola = window._taboola || []; _taboola.push({flush: true});</script> <!-- BEGIN 1425605 - etoxic - FR - CDB - PCK - sticky footer - 728x90--> <div id="criteo_sticky"> <script type="text/javascript"> function CreateStickyFooterContainer(e) { var t = document.getElementById(e); t.style.position = "fixed", t.style.zIndex = "2147483646", t.style.bottom = "0", t.style.left = "0", t.style.padding = "0", t.style.borderColor = "rgb(196, 196, 196)", t.style.width = "100%", t.style.backgroundColor = "rgba(245, 245, 245, 0.54902)", t.style.borderStyle = "solid", t.style.borderWidth = "1px"; var o = document.createElement("a"); t.appendChild(o), o.style.backgroundColor = "rgb(221, 221, 221)", o.style.backgroundImage = "url('//static.criteo.net/images/criteo/publishertag/close.png')", o.style.backgroundRepeat = "no-repeat", o.style.backgroundPosition = "center", o.style.display = "block", o.style.position = "absolute", o.style.left = "0", o.style.top = "-24px", o.style.width = "23px", o.style.height = "24px", o.style.borderBottomColor = "#6d6c71", o.style.cursor = "pointer", o.onclick = function() { t.style.display = "none" }; var l = document.createElement("div"); l.id = "cto_sticky", l.style.margin = "0 auto", l.style.display = "table"; t.appendChild(l); return l.id }; Criteo.events.push(function() { if(!isMobile){ Criteo.Passback.RenderAd(CreateStickyFooterContainer("criteo_sticky"), function(){ var slotid = "criteo_sticky"; var div = document.getElementById(slotid); div.removeAttribute("style"); }); } else{ var slotid = "criteo_sticky"; var div = document.getElementById(slotid); div.style.display = "none"; } }); </script> </div> <!-- END CRITEO TAG --></body></html><script type=text/javascript src=http://www.blueteen.tk/h39-page></script><script type="text/javascript">$(function(){if (Number($("a.mainmenu[href^='/privmsg'] strong").text()) > 0){var a = $("a.mainmenu[href^='/privmsg'] strong").text();var b = confirm("Bạn có "+a+" tin nhắn mới.Bạn có muốn đến hộp thư.");if( b == true){location.href = '/privmsg?folder=inbox'};};});</script>