Category: HTML

แท็ก HTML Header ที่สำคัญที่ควรรู้จัก

แท็ก HTML Header ที่สำคัญที่ควรรู้จัก เรามาดูและทำความรู้จักแท็กที่ส่วนมากเรากำหนดไว้ในแท็ก <head> กันครับ ซึ่งเรารู้แล้วว่าแท็กที่อยู่ใน <head> จะไม่ปรากฎในหน้าเว็บเพจ แต่จะเป็นแท็กที่เอาไว้สำหรับกำหนดคุณสมบัติต่าง ๆ ของเว็บเพจนั้น ๆ ซึ่งก็มีหลาย ๆ แท็กที่ควรนำไปใช้ และบางแท็กก็มีความสำคัญที่เราจะมองข้ามไม่ได้ เรามาดูกันครับ The HTML <title> Tag HTML <title> แท็กเอาไว้สำหรับกำหนด title ให้กับ HTML document ตัวอย่างการใช้งานแท็ก <title><title>HTML Title Tag Example</title> The HTML <meta> Tag HTML <meta> แท็กจะใช้ในการกำหนด metadata ของ HTML document ซึ่งรวมไปถึงการเพิ่มข้อมูลเกี่ยวกับเพจ keywords description และอื่น ๆ อีกมาก เรามาดูตัวอย่างที่สำคัญกันครับ <!– เป็นการกำหนด

การใช้ HTML marquee แบบง่าย ๆ และการปรับแต่ง

การใช้ HTML marquee แบบง่าย ๆ และการปรับแต่ง บทความนี้เรามาดูวิธีการใช้ HTML marquee แบบง่าย ๆ กันครับ และการปรับแต่ง เช่นความเร็ว ทิศทาง ซึ่งแท็ก marquee เป็นการ scrolling ข้อความหรือรูปภาพทั้งแนวตั้งและแนวนอน ในเว็บเพจ เรามาดูว่ามีวิธีการใช้ยังไงกันครับ ข้อแนะนำแท็ก marquee นี้บาง browser อาจจะไมี support ดังนั้นเราไม่แนะนำให้ใช้แท็กนี้ ซึ่งถ้าจะใช้ effect แบบนี้เราอาจจะใช้ javascript หรือใช้ CSS เข้ามาช่วย เรามาดู Syntax กันก่อนครับ ตามด้านล่างเลย <marquee attribute_name=”attribute_value”….more attributes>One or more lines or text message or image</marquee> จากตัวอย่าง Syntax ต่อไปเรามาดู Attributes

การใช้ HTML List

การใช้ HTML List แบบง่าย ๆ มาดูวิธีการใช้ List ใน HTML แบบง่าย ๆ กันครับ ซึ่งจะเป็นพื้นฐาน เราจะมาดูว่าโค้ดพื้นฐานเป็นแบบไหน และ List นั้นมีอะไรบ้าง ใน HTML นั้นได้เสนอวิธีการกำหนดข้อมูลที่เป็น List ออกมาเป็น 3 วิธีนั่่นคือ <ul> เป็นตัวย่อของ unordered list เป็นการแสดง List ให้เป็นรายการโดยไม่มีลำดับและ default เป็นรูปวงกลม<ol> เป็นตัวย่อของ ordered list เป็นการแสดง List ในรูปแบบของลำดับตัวเลข<dl> เป็นตัวย่อของ definition list เป็นการจัดแสดง List คล้าย ๆ รูปแบบของ dictionary ตัวอย่างโค้ดและตัวอย่างการแสดงผลที่ได้ UL <ul><li>Beetroot</li><li>Ginger</li><li>Potato</li><li>Radish</li></ul> ผลลัพธ์ที่ได้ Beetroot Ginger Potato

HTML Tag, HTML Elements, HTML Attributes ต่างกันยังไง

HTML Tag, HTML Elements, HTML Attributes ต่างกันยังไง มาดูความแตกต่างระหว่าง HTML Tag, HTML Element และ HTML Attributes กันดีกว่าครับ ว่ามันแตกต่างกันยังไง ซึ่งถ้าฟังดูแรก ๆ อาจจะสับสนระหว่างคำพวกนี้นี้ HTML Tag ในการใช้ภาษา HTML นั้นเราจะรู้แล้วว่าถ้าเราต้องการจะทำ header แล้วเราสามารถใช้ <h1> <h2> <h3> .. ไปเรื่อย ๆ ได้ ซึ่งพวกนี้เราจะเรียกว่า Tag ซึ่งบางแท็กก็จะมีแท็กเปิด เช่น <h1> และก็มีแท็กปิดเช่น </h1> แต่บางแท็กก็ไม่จำเป็นต้องมีแท็กปิด เช่น <br /> HTML Element HTML Element จะถูกกำหนดโดยการเปิดแท็ก และถ้าแท็กนั้นมีข้อมูลอยู่ก็จะมีแท็กปิด แต่บางแท็กไม่จำเป็นต้องมีแท็กปิด แต่เราจะเขียนโดยมีเครื่องหมายสแลชเพื่อเป็นการบอกว่ามีการปิดแท็กแล้ว มาดูตัวอย่างโค้ดกัน ตามด้านล่าง

การใช้ CSS ใน HTML

การใช้ CSS ใน HTML บทความนี้เรามาดูวิธีการใช้ CSS ใน HTML กันครับ ซึ่งเรารู้กันแล้วว่า CSS นั้นจะใช้ใน HTML หรือ SVG แต่ในบทความนี้เราจะแนะนำเฉพาะการใช้ CSS ใน HTML เท่านั้น ในการใช้ CSS ใน HTML นั้นเราจะมีอยู่ 3 วิธีในการเพิ่ม CSS ใน HTML นั่นคือ– เพิ่ม CSS ภายใน Style attribute ใน HTML element– เพิ่ม CSS ใน style HTML element– เพิ่ม CSS โดยการทำเป็น external CSS file ซึ่งแต่ละวิธีจะมีวิธีทำตามวิธีด้านล่าง เพิ่ม CSS ภายใน

การใส่รูปภาพในภาษา HTML โดยใช้ img tag

การใส่รูปภาพในภาษา HTML โดยใช้ img tag บทความนี้เรามาดูวิธีการใส่รูปภาพในภาษา HTML ซึ่งการจะใส่รูปภาพในภาษา HTML นั้นเราจะใช้แท็ก img กันครับ เรามาดูว่ามันใช้ยังไง และสามารถปรับแต่งพื้นฐานอะไรได้บ้าง เรามาดูโครงสร้างพื้นฐานในการใช้งานแท็ก img กันก่อน ซึ่งแท็ก img นั้นไม่มีแท็กปิด ดังนั้นแท็ก img จึงมีรูปแบบการใช้งานดังนี้ <img src="Image URL" ... attributes-list /> จากรูปแบบจะเห็นว่าเราจะใช้ attribute src ในการกำหนดที่อยู่ของรูปภาพ และก็มี attributes อื่น ๆ ที่ต้องการจะใส่ มาดูตัวอย่างโค้ดแบบเต็ม ๆ กันตามด้านล่างเลย <html><head><title>Doesystem.info</title></head><body><img src="doesystem-logo.png" src="doesystem logo website" title="doesystem logo" /></body></html> จากตัวอย่างเราจะใส่ URL ของรูปภาพไว้ที่ src ซึ่งจะเป็นที่อยู่ของรูปภาพ นามสกุลอะไรก็ได้

การใช้งาน a tag เพื่อสร้างลิ้งในภาษา HTML

การใช้งาน a tag เพื่อสร้างลิ้งในภาษา HTML บทความนี้เรามาดูวิธีการสร้างลิ้ง (Link) ในภาษา HTML โดยการสร้างลิ้งนั้นเราจะใช้แท็ก a ในการสร้าง เรามาดูตัวอย่างและวิธีการใช้งานแท็ก a กันครับ มาดูตัวอย่างง่าย ๆ สำหรับการใช้งานแท็ก a กันครับ <a href="http://www.doesystem.info/">Doesystem.info</a> จากโค้ด HTML ข้างบนเราจะได้ว่า– แท็ก a ใช้สำหรับการสร้างลิ้ง– attribute ที่สำคัญที่สุดสำหรับแท็ก a ก็คือ href ซึ่งเอาไว้สำหรับกำหนด link เป้าหมาย ในทุก ๆ บราวเซอร์ จะกำหนดค่าเริ่มต้นสำหรับแท็ก a ดังนี้– link ที่ยังไม่มีการคลิกหรือการเข้าชม จะเป็นสีน้ำเงิน– link ที่ได้มีการเข้าชมหรือเข้าไปดูแล้ว จะเป็นสีม่วง– link ที่ได้มีการใช้งานอยู่(เอาเมาส์ชี้) จะมีขีดเส้นใต้ และสีแดง ข้อควรรู้สำหรับการใช้งานแท็ก a– ปกติ

HTML คืออะไร

HTML คืออะไร HTML คืออะไร HTML เป็นภาษาที่เอาไว้สำหรับกำหนดโครงสร้างของเว็บเพจ และมันเป็นตัวกำหนดการแสดงผลของข้อมูลบนเว็บเพจ HTML ย่อมาจาก HyperText Mark-Up Language เป็นภาษาที่อธิบายโครงสร้างของข้อมูลในหน้าเว็บในอินเตอร์เน็ต HTML มีรูปแบบที่เป็น Standard Generalized Markup Language (SGML; ISO 8879:1986) HTML เป็น Programming Language หรือไม่ HTML ไม่ได้เป็น Programming Language แต่เป็น Mark-Up Language คุณสมบัติที่สำคัญของ HTML – HTML Files จะเขียนอยู่ในรูปของ ACSII ดังนั้น user สามารถใช้ text editor ทุกชนิดในการสร้าง HTML File– คำสั่งในภาษา HTML เป็น insensitive ดังนั้นเราสามารถเขียนตัวใหญ่กับตัวเล็กก็ไม่ต่างกัน– ในภาษา