imkopkap

#1 : สร้างเว็บไซต์ภาษา html : ทำความรู้จักโครงสร้างเว็บไซต์และ Heading , p

ใช้เวลา 6 นาที 03/08/2014

ภาษา html หรือชื่อเต็มที่เรียกว่า Hyper text markup language ก็จะเป็นภาษาที่ใช้ในการสร้างเว็บไซต์นั่นเองครับ ในส่วนของคลิปวิดีโอนี้ผมก็จะเกริ่นสำหรับคนที่ยังไม่เป็นอะไรเลยนะครับ เป็นคลิปแรกของผมเหมือนกันดีไม่ดียังไง Comment ได้นะครับ

 

 

รู้จักโครงสร้างของภาษา html

<!DOCTYPE html>
<html>
<head>
     <title>ก๊อปแก๊ป</title>
     <meta charset="utf-8"/>
</head>
<body>
    <h1>Kopkap</h1>
    <p>สร้างเว็บไซต์ด้วย WordPress</p>
</body>
</html>

เราสามารถพิมพ์โค้ดลงไปได้ในแท็ก Body และให้สังเกตุว่าทุกคครั้งที่เราสร้างไฟล์ html ขึ้นมามันจะมีคำว่า <!Doctype> ไว้ให้เสมอ ซึ่งการทำงานก็จะมีสองส่วนคือ ส่วน <head> ในส่วนนี้ก็มีการเพิ่มพวก Meta การใส่ Css การใส่ Javascript การกำหนดชื่อเว็บ การใส่ Favicon เป็นต้น

 

รู้จักกับแท็ก

ทุกครั้งที่เรา คำหลักการของมันไว้ว่าเมื่อเรามี แท็กเปิดเช่น <a> เราก็ต้องมีแท็กปิด </a> นะครับห้ามเลยนะครับถ้าลืมมันจะไม่แสดงผลให้เรา

 

<p> : ตัวนี้จะเป็นกำหนดข้อความว่า … ที่อยู่ภายใน <p> </p> เนี่ยคือข้อความนะ
<h1> : ตัวนี้จะเป็นการจัดลำดับความสำคัญเหมาะแก่การทำ Seo ซึ่งมันจะมีความสำคัญตั้งแต่ H1 – H6 แน่นอน H1 มีความสำคัญมากสุด น้อยที่สุดก็จะคือ H6
<i> : การทำให้ Font เอียง
<b> : การทำให้ Font หนา
<Strong> : การทำให้ Font หนาเช่นกันแต่ทำ Seo ดีกว่า
<img> : การใส่รูปภาพ
<a> : การใส่ลิ้ง

 

<!DOCTYPE html>
<html>
 <head>
 <title>HTML</title>
 <link rel="stylesheet" type="text/css" href="style.css">
 <script type="text/javascript" href="js.js"></script>
 </head>
 <body>
 <p>test</p>
 <h1>h1</h1>
 <h2>h2</h2>
 <h3>h3</h3>
 <h4>h4</h4>
 <h5>h5</h5>
 <h6>h6</h6>
 <a href="http://www.google.com">Google.com</a>
 <img src="images/pic.jpg">
 <b>Bold</b>
 <strong>Strong</strong>
 <i>Inlatic</i> <!-- tag i -->
 </body>
</html>

บันทึกแนะนำ