บทเรียน - เขียนโปรแกรม เบื้องต้น

ให้เรตสมาชิก: 3 / 5

ดาวใช้งานดาวใช้งานดาวใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งาน

บทที่ 18  Scripts
   {--mlinkarticle=2187--}JavaScript {--mlinkarticle--} เป็นภาษาที่เป็น Script ที่อยู่ในเว็บไซต์ (ใช่ร่วมกับ HTML) เพื่อให้เว็บไซต์ของเราดูมีการเคลื่อนไหว สามารถตอบสนองผู้ใช้งานได้มากขึ้น โดยการใส่ Javascript ลงในโค๊ด HTML นั้นทำได้โดยใช้ แท็ก <script>  โดยจะแทรกอยู้ในแท็ก <head> และ แท็ก <body>
   ประโยชน์ของ javaScript
   เราจะใช้ JavaScript เมื่อต้องการทำให้ เวบเพจแสดงผลแบบเคลื่อนไหวได้ มีชีวิตชีวา ไม่แข็งทื่อ หรือใช้ในการสั่งให้ บราวเซอร์ทำงานตามที่เราต้องการ โดยงานนั้น อาจเกินความสามารถ ของภาษา HTML แต่ไม่ใช่งานที่ต้องติดต่อกับ Server นั่นเพราะ JavaScript เป็นภาษาที่ใช้ในการเขียนโปรแกรมทางฝั่ง client โดยมีบราวเซอร์เป็นตัวแปลภาษานั่นเอง ตัวอย่างของงาน ที่จะต้องใช้ภาษา JavaScript เช่น
    - สร้างเมนูที่สามารถตอบสนองต่อการเอา mouse ไปชี้ได้
    - สร้างเครื่องคิดเลข ปฏิทิน เกม ในเวบเพจ
    - เปิด, ปิด, เคลื่อนย้ายตำแหน่งของ window
    - ทำตัวอักษรวิ่งแบบต่างๆ
    - ตรวจสอบความถูกต้องของแบบฟอร์มที่ผู้ใช้กรอก ก่อนส่งข้อมูลไปยัง Server
    - และอื่นๆ อีกมากมายที่ไม่ต้องติดต่อกับ Server
ตัวอย่าง

<html>
<body>

<script>
document.write("Hello students!")
</script> 

</body>
</html>

ผลลัพธ์คือ

Tag ที่เกี่ยวข้อง
   1. แท็ก noscript ใช้ในการรองรับกรณีที่ผู้ใช้งานไม่อนุญาตให้รันสคริปส์ หรือ เว็บเบราว์เซอร์ไม่รองรับสคริปส์ เราสามารถใส่เนื้อหาในแท็ก noscript ได้เหมือนกับแท็ก body ซึ่งจะสามารถแสดงได้เหมือนไฟล์เอกสาร html ปกติ โดยเนื้อหาภายในแท็ก noscript จะแสดงก็ต่อเมื่อเว็บเบราว์เซอร์ไม่รองรับสคริปส์หรือไม่อนุญาตให้รันสคริปส์เท่านั้น
ตัวอย่าง

<html>
<body>

<script type="text/javascript">
document.write("สวัสดีนักเรียน")
</script>
<noscript>เว็บเบราว์เซอร์ของคุณไม่รองรับ JavaScript!</noscript>
 
</body>
</html>

ผลลัพธ์คือ

   2. ปุ่ม สำหรับลิงค์ไปหน้าอื่น
ตัวอย่าง

<html>
<body>

<p id="demo">
ภาษา HTML
</p>

<script>
function myFunction()
{
document.getElementById("demo").innerHTML="ภาษา HTML คือภาษาที่ใช้ในการเขียนเว็บ";
}
</script>

<button type="button" onclick="myFunction()">รายละเอียดเพิ่มเติม</button>

<script >
window.confirm("Are you sure you want to quit?")
</script>

</body>
</html>

ผลลัพธ์คือ


  3. เพิ่มเติมสไตล์ เช่น การสร้างปุ่ม สำหรับคลิกเลือกสีตัวอักษรที่ผู้ใช้งานต้องการให้แสดง

ตัวอย่าง

<html>
<body>

<p id="demo">
ไม่ชอบสีดำอยากเปลี่ยนเป็นแดง
</p>

<script>
function myFunction()
{
document.getElementById("demo").style.color="#ff0000";
}
</script>

<button type="button" onclick="myFunction()">คลิกตรงนี้</button>

</body>
</html>

 ผลลัพธ์คือ

   4. กล่องข้อความ (Message Box) เป็นส่วนที่ไว้สำหรับโต้ตอบกับผู้ใช้ แบ่งเป็น 3 แบบ คือ
           4.1 การเตือน (Alert)  ใช้สำหรับการขึ้นขอความเตือน ให้ผู้ใช้ระมัดระวัง หรือบอกกล่าวไปยังผู้ใช้ให้ทราบ  พิจารณาคำสั่งต่อไปนี้
ตัวอย่าง

<html>
<body>

<script >

window.alert("You can?t access to server!")

</script> 

</body>
</html>

ผลลัพธ์คือ

***ข้อความที่เขียนส่งให้เมธอด alert() เมื่อนำไปแสดงออกยัง ไดอะล็อกบ็อกซ์ จะปรากฏเป็นบรรทัดเดียว   ถ้าข้อความยาวมาก ไดอะล็อกบ็อกซ์ ที่ปรากฏ จะยาว ตามด้วย   หากผู้อ่านต้องการข้อความแยกกันหลายบรรทัด ให้ใช้ \n  แทรกระหว่างข้อความ
ตัวอย่าง

<html>
    body>

    <script language="JavaScript">
     alert("\n Hello   JavaScript  World \n Enjoy  with  JavaScript  now \n\n Click OK  to continue");
    </script>

    </body>
</html>

ผลลัพธ์คือ


   4.2 การยินยัน (Confirm)  เพื่อให้ผู้ใช้ยืนยันในกรณีที่ผู้ใช้อาจเผอเรอคลิกปุ่มโดยไม่ได้ตั้งใจ  เช่น ผู้ใช้กดปุ่มเพื่อลบข้อมูล หรือการออกจากโปรแกรม
ตัวอย่าง

<html>

<body>

<script >
window.confirm("Are you sure you want to quit?")
</script>

</body>
</html>

ผลลัพธ์คือ

   4.3 ตรวจสอบข้อมูล (Prompt)  เพื่อให้ผู้ใช้ป้อนข้อมูลก่อนเข้าไปยังระบบหรือเข้าหน้าเว็บ
ตัวอย่าง

<html>
<body>

<script >
window.prompt("please enter user name")
</script>

</body>
</html>

ผลลัพธ์คือ

   นอกจากนี้ยังมีตัวแปรที่เกิดจากการใช้ prompt ตัวอย่างเช่น

<html>
<body>

<script>

var y=window.prompt("please enter your name")

window.alert("Hello !   "  +y)

</script>

</body>
</html> 

***ตัวแปร y จะเก็บค่าที่ได้จากการป้อนของผู้ใช้  แล้วมาแสดงใน Message Box การเตือน ซึ่งมีข้อความ Hello !
ผลลัพธ์คือ

เมื่อผู้ใช้ป้อนชื่อแล้วกดปุ่ม OK จะเกิด Message Box ตามรูป



ให้เรตสมาชิก: 2 / 5

ดาวใช้งานดาวใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งาน

บทที่ 19 HTML Entities
   HTML Entities คือ อักขระพิเศษใน HTML เช่น เครื่องหมาย < หรือ > ถูกนำมาใช้สำหรับการกำหนดแท็ก HTML ทำให้ในบางสถานการณ์ เช่น เมื่อเราต้องการแสดงแท็กออกมาที่บราวเซอร์โดยตรง โดยไม่ต้องการให้บราวเซอร์แปลความหมายของแท็กนั้น อย่างเช่นเราต้องการให้บราวเซอร์แสดงข้อความต่อไปนี้
แท็ก <b> ใช้เมื่อต้องการทำให้เป็นตัวหนา และ แท็ก <u> ใช้สำหรับขีดเส้นใต้   แล้วเราพิมโค็ด

<html>
<body>

<p>แท็ก <b> ใช้เมื่อต้องการทำให้เป็นตัวหนา และ แท็ก <u> ใช้สำหรับขีดเส้นใต้ </p>

</body>
</html>  

ข้อความก็จะแสดงออกมาในบราวเซอร์ดังนี้

   จะพบว่าเบราวเซอร์ไม่ได้นำแท็ก <b>และ <u>มาแสดง แต่กลับแปลความหมายของแท็กนั้น จนทำให้มีผลต่อข้อความตามรูป ด้วยเหตุนี้จึงต้องมีการกำหนดสัญลักษณ์เพื่อใช้แทนอักขระพิเศษบางตัว ซึ่งนอกจาก < และ > แล้วยังมีอักขระพิเศษอีกหลายตัวที่ต้องใช้สัญลักษณ์แทน ตัวอย่างเช่น

อักขระ สัญลักษณ์ที่ใช้แทน
ช่องว่าง &nbsp;
< &lt;
> &gt;
& &amp;
? &cent;
? &pound;
? &yen;
? &euro;
? &sect;
? &copy;
? &reg;
? &trade;

  
   ดังนั้นหากต้องการให้บราวเซอร์แสดงข้อความ ตามด้านล่าง
แท็ก <b> ใช้เมื่อต้องการทำให้เป็นตัวหนา และ แท็ก <u> ใช้สำหรับขีดเส้นใต้เราจึงต้องพิมพโค๊ด ดังนี้

<html>
<body>

<p>แท็ก &lt b &gt ใช้เมื่อต้องการทำให้เป็นตัวหนา และ แท็ก &lt u &gt ใช้เมื่อต้องการขีดเส้นใต้</p>

</body>
</html>

ผลลัพธ์ที่ได้คือ

ให้เรตสมาชิก: 2 / 5

ดาวใช้งานดาวใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งาน

บทที่ 20 XHTML
   {--mlinkarticle=2192--}XHTML{--mlinkarticle--} เป็นภาษาที่ถูกกำหนดให้เป็นภาษามาตรฐานใหม่ที่จะใช้ในการสร้างเว็บเพจต่อไปในอนาคต เว็บเบราเซอร์์ทุกค่ายจะรองรับการใช้งาน XHTML และในอนาคตปัญหาการแสดงผลที่ไม่เหมือนกัน ในเว็บเบราเซอร์์ต่างค่ายกันก็จะหมดไป
   XHTML ไม่ได้ต่างจาก HTML มากมายอะไรนัก เพียงแต่ว่าเข้มงวดเรื่องความถูกต้องของ syntax มากขึ้นสำหรับ HTML แม้ว่าเราเขียน code ผิดพลาดไปบ้าง เช่น ลืม tag ปิด เว็บเบราเซอร์์ ก็ยังสามารถตีความและแสดงผลได้อย่างถูกต้องเป็นส่วนมาก

   สิ่งแตกต่างที่สำคัญระหว่าง XHTML กับ HTML ได้แก่

    1. ทุก XHTML element ที่ซ้อนกันต้องเรียงลำดับให้ถูก แต่ละ element ต้องไม่เปิด ปิด ข้ามกัน ใน HTML เราสามารถเขียนสลับ tag ปิดกันได้ เช่น

<b><i>ข้อความนี้เป็นตัวหนา และตัวเอียง</b></i>


แต่สำหรับ XHTML แล้ว เราจะต้องเรียงลำดับการปิดของ tag ให้ถูกต้อง

<b><i>ข้อความนี้เป็นตัวหนา และตัวเอียง</i></b>

     2. ทุก XHTML element ต้องทำการปิดให้เรียบร้อย ไม่เว้นแม้แต่ element ที่ไม่มี tag ปิด เช่น <br> จะต้องทำการปิด โดยใช้เครื่องหมาย ' /' เป็น <br /> เป็นต้น
ใน HTML เราอาจลืม tag ปิดได้

<p>ข้อความที่ 1
<p>ข้อความที่ 2 <br>
ข้อความที่ 3 <hr>
<img src="/pic.gif">

แต่สำหรับ XHTML แล้ว จะต้องทำการปิดให้เรียบร้อยทุก tag

<p>ข้อความที่ 1</p>
<p>ข้อความที่ 2 <br />
ข้อความที่ 3 <hr />
<img src="/pic.gif" />
</p>

   3. ทุก XHTML element ต้องเขียน tag, attribute และค่าของ attribute ด้วยตัวพิมพ์เล็ก
ใน HTML เราจะใช้์ตัวพิมพ์เล็กหรือพิมพ์ใหญ่ก็ได้

<BODY>
<P Align="CENTER">ข้อความจัดวางกึ่งกลาง</P>
</body>แต่สำหรับ XHTML แล้ว ให้ใช้ตัวพิมพ์เล็กทั้งหมด
<body>
<p align="center">ข้อความจัดวางกึ่งกลาง</p>
</body>

   4. ค่าของ attribute ต้องอยู่ในเครื่องหมาย ".." เสมอ
ใน HTML เราอาจจะไม่ใส่เครื่องหมาย ".." ครอบค่าของ attribute ก็ได้

<table width=100%>

แต่สำหรับ XHTML แล้ว เราจะต้องใส่เครื่องหมาย ".." ให้ ค่าของ attribute

<table width="100%">

   5. เราไม่สามารถใช้รูปย่อของ attribute ได้
ใน HTML สามารถทำได้ เช่น

<input type="checkbox" checked>

แต่สำหรับ XHTML แล้วจะต้องเขียนเต็มแบบนี้

<input type="checkbox" checked="checked" />

   6. ใช้ attribute id แทน attribute name
ใน HTML จะใช้ attribute name สำหรับ element ต่าง เช่น applet, frame, iframe, input และ img

<img src="/picture.gif" name="pic1">

แต่สำหรับ XHTML แล้ว ให้ใช้ attribute id แทน

<img src="/picture.gif" id="pic1" />

และเพื่อให้ใช้กับเว็บเบราเซอร์์รุ่นเก่าได้ ให้ใส่้ทั้ง attribute id และ attribute name ควบคู่กัน

<img src="/picture.gif" id="pic1" name="pic1" />

ให้เรตสมาชิก: 3 / 5

ดาวใช้งานดาวใช้งานดาวใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งาน

แท็กที่เกี่ยวกับตัวอักษร ใน HTML พื้นฐาน

<Hn> ข้อความ </Hn> กำหนดขนาดของหัวเรื่อง (Heading) เมื่อ n แทนระดับของหัว เรื่องโดยมีระดับ H1 ใหญ่สุด ถึง H6 เล็กสุด
<FONT COLOR="รหัสสีหรือชื่อสี ">ข้อความ</FONT> กำหนดสีของข้อความโดยกำหนดรหัสสี หรือ ชื่อสี
<FONT FACE="ชื่อฟอนต์">ข้อความ</FONT> กำหนดชื่อฟอนต์ที่ต้องการใช้ สามารถใส่ชื่อฟอนต์ได้หลายฟอนต์ พร้อมๆกัน
<FONT SIZE="3" >ข้อความ</FONT> กำหนดขนาดของฟอนต์ กำหนด ได้จาก 1 ถึง 7 โดยที่ 1 ขนาดเล็กสุด 7 ใหญ่สุด
<B>ข้อความ</B>หรือ
<strong>ข้อความ</strong>
ทำข้อความให้เป็นตัวหนา
<I>ข้อความ</I> หรือ <em>ข้อความ</em> ทำข้อความให้นอนเป็นตัวเอน
<u>ข้อความ</u> ขีดเส้นใต้ข้อความ <strike>ข้อความ</strike> ขีดฆ่าข้อความ
<big>ข้อความ</big> เพิ่มขนาดอักษรขึ้นอีก 1 ระดับ
<small>ข้อความ</small> ลดขนาดตัวอักษรลง 1 ระดับ
<blink>ข้อความ</blink> ข้อความกระพริบ ใช้ได้ กับ เบราว์เซอร์บางตัว
<sub>ข้อความ</sub> แสดงข้อความแบบตัวห้อย
<sup>ข้อความ</sup> แสดงข้อความแบบตัวยกกำลัง
<comment>ข้อความ</comment> ใส่ข้อความหมายเหตุเมื่อไม่ต้องการให้ข้อความแสดง
   
   

ให้เรตสมาชิก: 4 / 5

ดาวใช้งานดาวใช้งานดาวใช้งานดาวใช้งานดาวไม่ได้ใช้งาน

Adaptive Images (อแดปทีพ อิมเมจ) : Picture Element (พิคเจอ อเลเม้น) และ Srcset Attribute (เอสอาซีเซ็ท แอทริบิ้ว) คืออะไร

 Adaptive Images : Picture Element และ Srcset Attribute คืออะไร

 

      ในการทำ responsive web design (เรสป้อนซีพ เว็บ ดีไซน์) หากพูดถึงการใช้รูปต่างๆ ในหน้าเว็บแล้ว เราอาจจะต้องเลือกใช้รูปขนาดใหญ่สุดเพื่อที่จะสามารถแสดงผลได้อย่างคมชัดบน desktop (เดสท็อป) เเต่ด้วยข้อจำกัดของ responsive web design ทำให้เว็บในแต่ละเวอร์ชั่นนั้นจะใช้โค้ดร่วมกัน ไม่ว่าจะเป็น mobile (โมบาย), tablet (เเท็ปเล็ต) หรือ desktop ก็ตาม ด้วยเหตุนี้เอง จึงทำให้เกิดปัญหาที่ว่า mobile อาจจะต้องมาโหลดรูปขนาดใหญ่โดยไม่จำเป็นหรือผู้ที่ใช้ retina display (เรติน่า ดิสเพลย์) อาจจะพบว่ารูปที่โหลดมานั้นไม่คมชัดเท่าไรนัก เนื่องจากเป็นรูปที่ไม่ได้รองรับหน้าจอความละเอียดสูงนั่นเอง

      ปัญหาเกี่ยวกับรูปใน responsive web (เรสปอนซีฟ เว็บ) นี้ กลายเป็นปัญหาสำคัญ จึงทำให้เกิดการแก้ปัญหาที่เรียกว่า “Adaptive images (อแดปทีพ อิมเมจ)” ขึ้นมา โดยจุดประสงค์ก็คือ การทำให้ผู้ใช้งานโหลดเฉพาะรูปที่เหมาะสมกับสภาพแวดล้อมของผู้ใช้งานในขณะนั้นๆ แทนที่จะบังคับให้ผู้ใช้งานโหลดรูปขนาดใหญ่สุดไป แต่วิธีนี้นั้นค่อนข้างจะซับซ้อนและทำได้ยาก

picture element (พิคเจอร์ เอเลเม้น) ของ RICG (อาร์ไอซีจี) (Responsive Images Community Group (เรสปอนซีพ อิมเมจ คอมมูนิตี้ กรุ๊ป)) นั้นได้แรงบันดาลใจมาจาก video element (วีดีโอ เอเลเม้น) ซึ่ง RICG มองว่า pattern (เเพทเทริน) แบบนี้ authors(ออเทอร์) น่าจะคุ้นเคยกันเป็นอย่างดี จุดเด่นของ picture element (พิคเจอร์ เอเลเม้น) ก็คือการรองรับ media queries (มีเดีย คิวรี่) ซึ่งนั่นก็หมายความว่าเราสามารถกำหนดเงื่อนไขของการเลือกรูปมาแสดงได้ด้วยตัวเอง นอกจากนี้ picture element (พิคเจอร์ เอเลเม้น) ยังมี fallback (ฟอลเเบ็ค) สำหรับ web browsers (เว็บ บราวเซอร์) ที่ยังไม่รองรับอีกด้วย ซึ่งเป็นหลักการเดียวกับ video element นั่นเอง

 Adaptive Images : Picture Element และ Srcset Attribute คืออะไร

 

อย่างไรก็ดี picture element (พิคเจอร์ เอเลเม้น) อาจจะมีปัญหาอยู่บ้างในเรื่องของ performance (เพอฟอร์มแมน) เนื่องจาก parser (พาเซอร์) ของ web browsers (เว็บ บราวเซอร์) จะต้องมาเสียเวลาหา </picture> ให้เจอเสียก่อน จึงจะสามารถคำนวณได้ว่าควรเลือกรูปไหนมาแสดง

Srcset Attribute ไอเดียของ Edward O’Connor กันบ้าง เขาเลือกที่จะใช้ adaptive images (อแดปทิพ อิมเมจ) กับ img element (ไอเอ็มจี เอเลเม้น) เหมือนเดิม แทนที่จะสร้าง html element ขึ้นมาใหม่ เพียงแต่ว่าเขาเสนอให้เพิ่ม attribute เข้ามาอีกอันหนึ่ง ซึ่งก็คือ srcset นั่นเอง

 

Adaptive Images : Picture Element และ Srcset Attribute คืออะไร 

จากตัวอย่างการใช้ srcset attribute ด้านบน จะเห็นว่า srcset นั้นจะประกอบไปด้วยรูปเวอร์ชั่นต่างๆ ที่เราได้เตรียมไว้ โดยจะมี comma (คอมม่า) คั่นอยู่ จุดเด่นของ srcset attribute ก็คือเราจะสามารถใส่ “hint(คำใบ้)” ให้กับแต่ละเวอร์ชั่นได้ด้วยว่าเราอยากให้ web browsers เลือกรูปนี้มาแสดงเมื่อใด hint (ฮิ้น) ของ srcset attribute นั้นมีอยู่ 3 แบบ ด้วยกัน คือ w, h และ x โดย x นั้นจะหมายถึง pixel density ของ device นั้นๆ นั่นเท่ากับว่า เราสามารถเลือกแสดงรูปให้เหมาะสมกับหน้าจอความคมชัดสูงอย่าง retina display ได้แล้ว ส่วน w กับ h นั้นจะหมายถึงขนาดของ viewport ที่ใหญ่ที่สุด หรือ max-width และ max-height นั่นเอง ลองดูตัวอย่างต่อไปนี้

 

Adaptive Images : Picture Element และ Srcset Attribute คืออะไร 

จากตัวอย่างด้านบนจะเห็นว่า hint แบบ w นั้นจะอ้างอิงกับ max-width ไม่ใช่ min-width โดยรูปขนาดใหญ่ที่สุดที่เราจะใช้กับ infinite width (อินฟินิตี้ วาย) นั้นให้เราใส่ hint เป็น 1x ซึ่ง web browsers จะรู้เองว่ามันควรใช้รูปนี้มาแสดงผล หาก viewport (วิวพอร์ท) มีความกว้างมากกว่า 1280 p จะเห็นว่า srcset attribute นั้นมีข้อดีตรงที่เราไม่ต้องมาเขียน query (คิวรี่) เองว่าจะเลือกรูปไหนมาแสดงผล เราเพียงแต่ใส่ hint เข้าไปเท่านั้น ที่เหลือก็ปล่อยให้ web browsers (เว็บ บราวเซอร์) ตัดสินใจเองว่าจะเลือกรูปไหนมาใช้ซึ่งมันจะเลือกรูปที่ “เหมาะสม” ที่สุดในสภาพแวดล้อมนั้นๆ มาแสดงโดยอัตโนมัติ โดยมันจะดูจากปัจจัยหลายๆ อย่าง ไม่ว่าจะเป็น network speed (เน็ตเวริค สปีด) , latency (เลเทนซี่) รวมไปถึง orientation (โอเลี่ยนชัน)

ทำไมต้องมีทั้ง picture element และ srcset attribute ? 

      คำตอบง่ายๆ เลยก็คือ ทั้ง 2 solutions (โซโลลูชัน) ต่างก็ยังไม่สามารถตอบโจทย์ของ adaptive images ได้ครบในทุกๆ use cases (ยูส เคส) บ่อยครั้งที่เราพบว่ารูปใน mobile (โมบาย) นั้นเล็กจนดูไม่รู้เรื่อง ทั้งนี้เป็นเพราะว่าคนส่วนใหญ่จะลดขนาดของรูปลงให้สัมพันธ์กับขนาดของหน้าจอ พวกเขาอาจลืมไปว่าในบางครั้ง จุดโฟกัสนั้นไม่ได้อยู่ที่กึ่งกลางของรูป การกำหนดขนาดของรูปให้เป็น % โดยอิงตาม container (คอนเทนเนอร์) นั้นอาจทำให้ใจความสำคัญของรูปเสียไป หรืออาจเล็กลงมากจนดูไม่รู้เรื่องเมื่อดูในหน้าจอขนาดเล็ก

ให้เรตสมาชิก: 3 / 5

ดาวใช้งานดาวใช้งานดาวใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งาน

แท็กรูปแบบพารากราฟ Paragraph ใน HTML 

แท็กรูปแบบพารากราฟ
<p>ข้อความ</p> ย่อหน้าใหม่โดยเว้นบรรทัดว่าง 1 บรรทัด
<br/> ขึ้นบันทัดใหม่ เป็น tag เดียวไม่มี tag ปิด
<center>ข้อความ</center> กำหนดข้อความหรือรูปภาพให้แสดงผลกึ่งกลางหน้าเอกสาร
<p align="ตำแหน่งข้อความ ">ข้อความ</p> กำหนดการวางตำแหน่งข้อความในพารากราฟ ใช้ align ได้ดังนี้ left, center, right เพื่อวาง ซ้าย กลาง และ ขวาสุดตามลำดับ

เป็น tag สำหรับจัดการตำแหน่งของข้อความ

ให้เรตสมาชิก: 3 / 5

ดาวใช้งานดาวใช้งานดาวใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งาน

โครงสร้างภาษา HTML (HyperText Markup Language

โครงสร้างภาษา HTML (HyperText Markup Language

ภาษา HTML จะเก็บให้มีนามสกุล .html หรือ .htm โดยที่เอกสาร HTML มีองค์ประกอบ 2 ส่วน คือ ส่วนที่เป็นเนื้อหา และส่วนที่เป็นคำสั่งหรือแท็กรูปแบบโครงสร้างของเอกสาร HTML จะเป็นดังนี้

<HTML>?</HTML> เป็นคำสั่งเริ่มต้นและสิ้นสุดเอกสาร HTML
<HEAD>?</HEAD> ใช้กำหนดข้อความในส่วนที่เป็นชื่อเรื่องภายในคำสั่งนี้ จะมีคำสั่ง ย่อย <TITLE> อีกหนึ่งคำสั่ง
<TITLE> ? </TITLE> เป็นส่วนแสดงชื่ออกสารโดยจะแสดงที่ไตเติล บาร์ของ วินโดว์ที่ เปิดเอกสารนี้อยู่เท่านั้น
<BODY>?</BODY> ส่วนเนื้อหาของโปรแกรมจะเริ่มต้นด้วยคำสั่ง <BODY> และสิ้นสุดที่ คำสั่ง </BODY> ในระหว่างคำสั่งทั้งสองนี้จะมีส่วนแท็กต่างๆมากมาย



ให้เรตสมาชิก: 5 / 5

ดาวใช้งานดาวใช้งานดาวใช้งานดาวใช้งานดาวใช้งาน

การทำให้รูปภาพมีลิ้งได้หลายลิ้งโดยการกำหนดพื้นที่ให้รูปภาพ

 

          ในกรณีที่เราอยากให้รูปภาพเพียงรูปเดียวลิ้งไปได้หลายหน้าโดยที่เราไม่ต้องใส่รูปภาพหลายๆรูปโดยใน HTML เราสามารถกำหนดพื้นที่ที่จะทำลิ้งไปได้ และยังสามารถกำหนดรูปร่างของพื้นที่ได้ไม่ว่าจะเป็นรูปวงกลางหรือรูปสี่เหลี่ยมได้ตามความต้องการของเรา โดยจะใช้แท็กที่ชื่อว่า <map></map> และภายในจะมีแท็ก <area> ในการใช้ระบุพื้นที่ที่ต้องการโดยในแท็กจะมีแอททิบิวต่างๆที่ใช้ในการกำหนด ดังรูปแบบ

สามารถดาวน์โหลดไฟล์ไปก่อนได้โดยจะมีไฟล์ตัวอย่างที่เอาไปลองเล่นได้ {mdfiles=490}

 

รูปแบบ

<map name="ชื่อที่จะนำไปใช้ในภาพ">
      <area shape="รูปทรงเช่นวงกลมหรือสี่เหลี่ยม" coords="พื้นที่" alt="ไตเติน" href="/ไฟล์ที่ต้องการลิ้งไป">
</map>

 

วิธีการทำ

  1. เลือกรูปภาพที่ต้องการจะแสดงและกำหนดขนาดความกว้างและความสูงตามที่ต้องการ ดังโค้ด
    <img src="/img/147642614-450x298.jpg" width="460" height="310" alt="Planets" usemap="#planetmap">​
  2. จากนั้นกำหนดพื้นที่ให้กับรูปภาพ ดังโค้ด
    <map name="planetmap">
          <area shape="circle" coords="95,130,40" alt="Red apples" href="/red_apples.html#">
          <area shape="circle" coords="230,170,50" alt="Green apple" href="/green_apple.html">
          <area shape="circle" coords="360,120,40" alt="Yellow apples" href="/yellow_apples.html">
    </map>​

    คำอธิบายโค้ดที่ต้องระบุ  คือ shape เป็นแอททิบิวในการระบุว่าจะให้เป็นพื้นที่รูปแบบไหนเช่น เป็นวงกลมก็จะใช้ cirele และถ้าเป็นสี่เหลี่ยมก็จะเป็น rect ส่วน coords เป็นแอททิบิวในการระบุพื้นที่ที่ต้องการจะให้มีลิ้งไปได้ ส่วน alt เป็นแอททิบิ้วในการแสดงไตเติล และ href เป็นแอททิบิวที่จะลิ้งไปยังไฟล์ที่ต้องการ 

  3. ผลลัพธ์ที่ได้
    การกำหนดพื้นที่ให้กับรูปภาพให้สามารถลิ้งไปยังหน้าอื่นได้
    การกำหนดพื้นที่ให้กับรูปภาพ

 

          การกำหนดพื้นที่ให้กับรูปภาพเพื่อลิ้งไปยังหน้าอื่นๆทำได้ง่ายดายมากแค่เรากำหนดพื้นที่ให้กับรูปภาพในส่วนที่เราต้องการได้และยังสามารถกำหลดรูปแบบของพื้นที่ได้ไม่ว่าจะเป็นแบบวงกลมหรือว่าแบบสี่เหลี่ยมได้ตามรูปแบบของรูปภาพที่ต้องการได้

 

ช่องทางการศึกษาเพิ่มเติมข่าวที่น่าสนใจเกี่ยวกับ : HTML css

ให้เรตสมาชิก: 3 / 5

ดาวใช้งานดาวใช้งานดาวใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งาน

แท็กการสร้างฟอร์ม HTML เอชทีเอ็มเเอล

แท็กการสร้างฟอร์ม
  <FORM parameter>?</Form>
    มีรูปแบบทั่วไปเป็น <FORM METHOD=?วิธีส่งข้อมูล? ACTION =?ตำแหน่งโปแกรมที่จะประมวลผล? ENCTYPE = ???></FORM>
METHOD มีอยู่2 แบบคือ
-POST ข้อมูลส่งไปยัง ตัวประมวลผลโดยไม่ผ่าน เซิร์ฟเวอร์
- GET ข้อมูลส่งไปยัง ตัวประมวลผลโดยผ่านทางเซิร์ฟเวอร์
ACTION =บอกตำแหน่งโปรแกรมประมวลผล
ENCTYPE = กำหนดรูปแบบการเก็บข้อมูลของฟอร์มเพื่อส่งไปยังเซิร์ฟเวอร์ จะใส่หรือไม่ก็ได้
  <INPUT parameter>
    เป็นแท็กที่กำหนดรูปแบบการรับข้อมูล มีรูปแบบ
<INPUT TYPE=??? NAME=??? SIZE=n MAXLENGTH =n VALUE=???>
TYPE = รูปแบบการรับข้อมูลจากบราวเซอร์ซึ่งมีรูปแบบดังนี้ TEXT , PASSWORD , CHECKBOX , RADIO , SUMIT , RESET
NAME ชื่อข้อมูล สำหรับกำหนดชื่อข้อมูลที่จะนำเข้าซึ่งควรมีความหมายสอดคล้องกับชนิดข้อมูลที่นำเข้า
VALUE ค่า สำหรับกำหนดค่าเริ่มต้นให้กับข้อมูลแต่ละตัว
SIZE กำหนดขนาดของกล่องข้อความ จำนวนอักษรที่ให้ใส่ได้
MAXLENGTH จำกัดจำนวนอักษร



หมวดหมู่รอง

บทเรียน MySQL Store Procedure เป็นเนื้อหาสำหรับสอน Store Procedure ด้วยภาษา SQL สำหรับ MySQL 5.x ศึกษาได้ง่ายๆ แบ่งออกเป็นเรื่องๆ

บทเรียน PostgreSQL Stored Procedures เป็นเนื้อหาสำหรับสอน Store Procedure ด้วยภาษา SQL สำหรับ PostgreSQL แนะนำ ใช้ PostgreSQL เวอร์ชั่น 9.x

บทเรียน Python Framework Flask ในการพัฒนา  Web Application

แนะนำการเขียน Website (เว็บไซต์) ตั้งแต่เริ่มต้นแนะนำทำความรู้จัก โครงสร้างต่างๆ วิธีการคเขียน ตัวอย่างการเขียน ส่วนประกอบที่สำคัญของภาษาโดยใช้ภาษา HTML (เอชทีเอ็มแอล) โดยไม่พึ่งเครื่องมือช่วย ใช้งานได้ทั้ง HTML xHTML สอนพื้นฐาน Tag html ต่างๆ ได้แก่ โครงสร้างภาษา HTML (HyperText Markup Language) วิธีการเขียนภาษา HTML โดยใช้ Notepad หรือ TextEdit ตัวอย่างการเขียนภาษา HTML ส่วนประกอบสำคัญของภาษา HTML

บทเรียน HTML5 (เอชทีเอ็มแอลห้า) ภาษามาร์กอัป ที่ใช้สำหรับเขียน website ที่พัฒนามาจาก HTML ในบทเรียนนี้ก็จะสอนในเรื่อง Tag (แท๊ก) ต่างๆ ของ HTML5 ที่เพิ่มมาจาก HTML4 หรือ xHTML (เอ็กซ์เอชทีเอ็มแอล) ทำความรู้จักตั้งแต่เบื้องต้นก่อนการเริ่มเขียน สามารถเขียนตามได้ มีโค้ดตัวอย่างให้สามารถเขียนตามได้ HTML5 new Elements อิลิเม็นท์ส่วนประกอบใหม่ๆ ใน HTML5 สามารถใช้งานได้ดียิ่งขึ้น HTML5 Canvas แท็กที่ใช้สร้างงานกราฟฟิกเปลี่ยนลูกเล่นการแสดงผลจากเดิม

บทเรียน CSS (ซีเอสเอส) หรือ Cascading Style Sheets ภาษาที่ใช้เป็นส่วนของการจัดรูปแบบการแสดงผลเอกสาร HTML สอนพื้นฐานของ CSS สอนรูปแบบการเขียน Syntax ที่เฉพาะ ใช้สำหรับตกแต่งเอกสาร HTML หรือ XHTML ให้มีหน้าตา สีสัน ตัวอักษร เส้นขอบ พื้นหลังการใส่ลูกเล่นให้หน้าเว็บด้วย CSS ความรู้เบื้องต้นเกี่ยวกับ CSS3 ใช้จัดรูปแบบการแสดงผลให้สวยงามขึ้น

บทเรียน เนื้อหา การเขียนเว็บเพจ ภาษา PHP ประวัติความเป็นมาของภาษา PHP ทำความรู้จักประวัติของ php mysql date datetime การใช้งาน math functions การใช้งาน php ส่งเมล send mail การสอดแทรกคำสั่งภาษา PHP ในเอกสาร HTML การใช้ตัวแปรในภาษา PHP การกำหนดค่าของตัวแปร คำอธิบาย Comment หมายเหตุ คอมเม้น ในภาษา PHP ตัวอย่างการใช้ echo เพื่อแสดงข้อความ การใช้ตัวแปรในภาษา PHP

ReactJS เป็น JavaScript library ตัวหนึ่ง สำหรับสร้าง UI (User interfaces) ที่มีการนำไปใช้ใน Facebook, Instagram

บทเรียน php 5 เนื้อหาสอนเขียน PHP5 แบบ OOP การเขียนโปรแกรมเชิงวัตถุใน PHP5 เรียนรู้การเขียนโปรแกรมภาษา PHP แบบ OOP (Object Oriented Programming) ที่จะช่วยให้สามารถเขียนโปรแกรมภาษา PHP ที่เป็นมาตรฐานสากลมากยิ่งขึ้น การสร้าง Methods สำหรับ Class php5  สร้างคลาส และใช้งานคลาส ใน PHP5 OOP Class Constructors in PHP5 ฟังก์ชั่นที่ถูกเรียกใช้งานโดยอัตโนมัติ

บทเรียนสอนการพัฒนา Web Application โดยการใช้ Joomla Framework การเขียนโปรแกรมตามหลัก MVC การสร้าง Component เรียนรู้ MVC แบบ Joomla การใช้ class ติดต่อฐานข้อมูล ของ Joomla สอน JHTML เพื่อสร้าง HTML แบบไม่ต้องเขียน Tag HTML เรียนรู้การสร้าง addon คอมโพเน้นท์ โมดูล ปลั๊กอิน สร้าง Controller สร้าง View ในส่วนที่ไม่ใช่ Template Joomla Model สร้างโฟลเดอร์สำหรับเก็บไฟล์ Model

สอนการเขียนเว็บ ด้วย Yii Framework ซึ่งเป็น PHP Framework ที่มีสมรรถนะสูง สำหรับการพัฒนา Web Application ตั้งแต่เริ่มจนทำเว็บด้วย Yii Framework ได้ Debug ด้วย Unit test สอนตั้งแต่พื้นฐานทำความรู้จัก Yii Framework  ความสามารถเด่นของ Yii Framework หลักการทำงานของ Yii Framework เริ่มต้นใช้ Yii Framework Testing การทดสอบ โปรแกรม Yii Framework โปรแกรมประยุกต์บนเว็บ

บทเรียน SQL สอนคำสั่ง SQL เพื่อการใช้งานที่หลากหลาย และเพื่อความเร็วในการค้นหาข้อมูลจากฐานข้อมูล ชนิดต่างๆ เช่น Mysql, Oracle, SQL SERVER, PGSQL และ SQL มาตรฐานอื่นๆ การใช้ INNER JOIN ชนิดของข้อมูล (Data type) คำสั่ง SQL การใช้ CASE การใช้สูตรทางคณิตต่างๆ ได้แก่ ABS, Power การแปลงชนิดข้อมูล การใช้ Operator การ SELECT ข้อมูล การ INSERT ข้อมูล

เนื้อหา บทเรียน SQL: http://www.mindphp.com/forums/viewforum.php?f=74

บทเรียน สอนการใช้งาน phpMyadmin สอนการช้งานโปรแกรมใช้ในการจัดการฐานข้อมูล Mysql บน browser ด้วย phpMyadmin ทำความรู้จัก phpMyAdmin การสร้างฐานข้อมูล Create Database การสร้างตาราง Create Table ในฐานข้อมูล การเพิ่มฟิลด์ Field ในตาราง ที่สร้างไว้แล้ว การป้อนข้อมูลของฟิลด์ Field ในตาราง Table การเพิ่ม user มีวิธีการใช้งานที่ง่ายๆ การลบข้อมูลในฟิลด์ Field การลบฟิลด์ Field ในตาราง การลบฐานข้อมูล Database MySQL วิธีการลบตาราง Table การแก้ไขข้อมูลในฟิลด์ Field การเปลี่ยนชื่อฐานข้อมูล นำเข้า Import ส่งออก Export ฐานข้อมูล นำเข้า Import ส่งออก Export ตาราง Table MySQL

บทเรียนสอนการใช้งาน PgAdmin มารู้จักและติดตั้ง PostgreSQL ระบบการจัดการฐานข้อมูลเชิงวัตถุ-สัมพันธ์ แบบ ORDBMS โดยสามารถใช้รูปแบบคำสั่งของภาษา SQL ได้เกือบทั้งหมด การเชื่อมต่อ SERVER รู้จักส่วนประกอบของโปรแกรม PostgreSQL การเชื่อมต่อฐานข้อมูล Connect to Database การสร้างฐานข้อมูล Create Database การสร้างตาราง Create Table การสร้างคอลัมน์ Column และคีย์หลัก Primary Key ให้กับตาราง Table การป้อนข้อมูลในคอลัมน์ Columns การลบข้อมูล Delete การแก้ไขข้อมูลในคอลัมน์ Columns 

บทเรียน Javascript เป็นการสอน เขียนโปรแกรมภาษา Javascript เบื้องต้น สำหรับ เป็นพื้นความรู้ในการพัฒนเว็บ ที่มีลูกเล่น และใช้คู่กับ CSS มีตัวอย่างโค้ดจาวาสคริปให้ ดาวน์โหลดไปทดลอง รันได้ สอนพื้นฐานการเขียนโปรแกรม ภาษา Javascript ทั้งหมด 19 บทเรียนรู้ง่าย ๆ เข้าใจได้เร็ว วิธีการใช้งาน JavaScript คำสั่งต่างๆ ในการเเสดงผลหน้าเว็บไซต์ Javascript statements คำสั่งที่ให้ทำงานตามลำดับ Comments เขียนข้อความบอกรายละเอียดในโค้ดโปรแกรม การประกาศตัวแปร

บทเรียนสอน AJAX ย่อมาจาก Asynchronous JavaScript and XML PHP AJAX เนื้อหา php Javascript XML บทเรียนการใช้งาน Ajax เทคนิคการเขียน สอนแบบเน้นลงมือปฏิบัติจริง การทำงานของ AJAX สร้าง Ajax ด้วย Jquery Example ควรมีความรู้ พวกภาษาที่ทำงาน บน server เช่น php, jsp, asp อย่างใดอย่างหนึ่งด้วย เพื่อเพิ่มประสิทธิภาพ และ ความสามารถของ AJAX ยิ่งขึ้น aj

บทเรียน Jquery สอน Jquery ตั้งแต่พื้นฐาน จนถึงการนำ jquery ไปใช้กับงานจริง ซึ่ง JavaScript Library ตัวหนึ่งที่นิยมมากในปัจจุบันซึ่งถูกออกแบบมาเพื่อให้การเขียน Javascript ทำความรู้จักกับ Jquery การ Selectors ส่วนที่เลือก การ Event Funtions กำหนดเหตุการณ์ต่าง ๆ ที่ผู้ใช้งานมีต่อเว็บไซต์ Effects เอฟเฟคต่างๆของ jQuery การมองส่วนต่างๆของหน้าเว็บ DOM = Document Object Model 

บทเรียนออนไลน์ android ประวัติความเป็นมาของ Android วิวัฒนาการ สอนการพัฒนา App android ตั้งแต่พื้นฐานและนำไปใช้ใน อุปกรณ์พกพา ได้จริงๆ พร้อมทั้งแนะนำ เทคนิคต่างๆ ในการพัฒนา App บน android OS การใช้งาน IDE พื้นฐานภาษา JAVA เครื่องมือในการพัฒนาสำหรับมือใหม่ที่เริ่มพัฒนา แนะนำ Android Studio เพราะไม่ต้องตั้งค่าเพิ่มเติม และง่ายต่อการใช้งาน
สำหรับท่านที่ยังไม่รู้ว่า android คืออะไรลองอ่านบทความนี้ 
พูดคุยการพัฒนาและปัญหาการใช้ Android

บทเรียน Python สอนการเขียน ภาษา Python เบื้องต้น Python สามารถพัฒนา Web Application ได้เหมือนกับ ภาษา PHP ,Perl , JSP และ ASP

บทเรียนออนไลน์ Java สอนกาเขียน  พื้นฐาน เรียนรู้ Java ตั้งแต่เบื้องต้น การเขียนโปรแกรมด้วยภาษา Java สอนตั้งแต่ Basic พื้นฐานจนการเขียนโปรแกรมสามารถนำไปใช้งานได้จริง 

เรียนภาษาอังกฤษกับโปรแกรมเมอร์ ฉบับโปรแกรมเมอร์สอน สอนภาษาอังกฤษที่เกี่ยวข้องกับคอมพิวเตอร์ ภาษาคอมพิวเตอร์เรียกว่าอะไร หมายถึงอะไรเรียนรู้ได้จากที่นี่

บทเรียน สอนการใช้ คอมพิวเตอร์พื้นฐาน สอน การใช้งานตั้งค่า Internet ความรู้ทั่วไป เกี่ยวกับคอมพิวเตอร์

หมวดหลัก วีดีโอสอน เขียนโปรแกรม ด้วยภาษาต่าง PHP, Python, Javascript, Odoo Website, Joomla, phpBB, PostgreSQL, Framework ต่างๆ

วีดีโอสอน เขียน php7 พื้นฐานสำหรับนักพัฒนาเว็บไซต์ ทำความรู้จัก php เครื่องมือที่ใช้พัฒนา โปรแกรม ภาษา PHP แนะนำ เครื่องมือ พัฒนา ทำความรู้จัก ตัวแปลใน php - PHP Variable

วีดีโอสอนเขียน Python สำหรับพื้นฐาน สามารถเขียนตามได้ง่าย การเขียน Server Script และ พัฒนาโมดูล OpenERP หรือ Odoo

บทเรียน CSS ความรู้เบื้องต้นเกี่ยวกับ CSS แนะนำ ซีเอสเอส ทำเว็บสวย ตกแต่งเว็บไซต์ให้สวยงามด้วยการใช้ CSS ทำตามได้ไม่ยาก อยากทำเว็บไซต์ให้สวยต้องดู

VDO สอนการใช้โปรแกรมจัดการฐานข้อมูล PostgreSQL สำหรับผู้ใช้งานเบื้องต้น สอนการสร้างฐานข้อมูล (Database) อธิบายเข้าใจง่าย สามารถศึกษาได้จากวีดีโอเลย

VDO สอนการใช้งาน phpBB Webboard (พีเอสพีบีบี เว็บบอร์ด) สอนการใช้งานตั้งแต่พื้นฐาน ไปจนถึงการสร้างเป็นเว็บบอร์ด อธิบายละเอียดสามารถเข้าใจได้ง่าย

VDO สอนการใช้งาน Odoo Website (โอดู เว็บไซต์) สอนการใช้งานเบื้อต้น การปรับแต่งส่วนต่างๆของ Odoo Website สามารถปรับแต่งได้อย่างไรบ้าง รับชมได้จากวีดีโอสอนการใช้งานเลย

VDO สอนการใช้งาน Joomla พื้นฐาน สามารถใช้งานส่วนอะไรได้บ้าง อยากปรับแต่ง Joomla ให้เป็นแบบที่ต้องการต้องทำอย่างไร ศึกษาได้จากวีดีโอ

บทเรียน Python GUI

บทเรียน Python Tensorflow สอนใช้งาน

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
เช็คของ ที่ตรวจแล้ว
โดย Kanyarat Kanthawong อ 26 พฤษภาคม 2019 3:48 pm บอร์ด SQL - Database
1
9
อ 26 พฤษภาคม 2019 4:47 pm โดย mindphp
B - Error เข้าระบบ อัตโนมัติ ด้วย facebook
โดย mindphp อ 26 พฤษภาคม 2019 5:57 pm บอร์ด phpbbthailand.com
0
2
อ 26 พฤษภาคม 2019 5:57 pm โดย mindphp
วิธีติดตั้ง Joomla 3.9.6 ตอนที่2
โดย jamepiyawat ส 25 พฤษภาคม 2019 5:42 pm บอร์ด Share Knowledge
0
14
ส 25 พฤษภาคม 2019 5:42 pm โดย jamepiyawat
วิธีติดตั้ง Joomla 3.9.6 บน Ubuntu ตอนที่1
โดย jamepiyawat ส 25 พฤษภาคม 2019 5:32 pm บอร์ด Joomla user Guide Knowledge
1
26
ส 25 พฤษภาคม 2019 8:10 pm โดย mindphp
รับค่ามาแล้วแต่แปลงไฟล์ไม่ได้ครับ
โดย teenproza7 ส 25 พฤษภาคม 2019 4:36 pm บอร์ด Programming - C/C++ & java & Python
5
27
ส 25 พฤษภาคม 2019 7:33 pm โดย mindphp
คำศัพท์ที่เจอบ่อยในการทำงาน Master data management
โดย nanthiya ส 25 พฤษภาคม 2019 4:29 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
16
ส 25 พฤษภาคม 2019 4:29 pm โดย nanthiya
python รับค่าจาก form แล้วสร้างเป็นไฟล์ เพื่อนำไปใช้ต่อ
โดย teenproza7 ส 25 พฤษภาคม 2019 3:19 pm บอร์ด Programming - C/C++ & java & Python
2
20
ส 25 พฤษภาคม 2019 7:14 pm โดย teenproza7
Localhost คืออะไร
โดย jamepiyawat ส 25 พฤษภาคม 2019 3:04 pm บอร์ด Share Knowledge
0
14
ส 25 พฤษภาคม 2019 3:04 pm โดย jamepiyawat
เจอปัญหา จุมล่าขอ Host จริงส่งเมลออกไม่ได้
โดย mindphp ส 25 พฤษภาคม 2019 1:06 pm บอร์ด ปัญหาการใช้ phpBB3, SMF, Joomla, Wordpress, CMS CRM
0
8
ส 25 พฤษภาคม 2019 1:06 pm โดย mindphp
ที่มาของชื่อกลุ่มดาวคนแบกงู
โดย jamepiyawat ส 25 พฤษภาคม 2019 11:50 am บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
14
ส 25 พฤษภาคม 2019 11:50 am โดย jamepiyawat
แปลข้อความเป็นภาษาอื่น ฟีเจอร์ใหม่ใน Microsoft Office
โดย teenproza7 ส 25 พฤษภาคม 2019 11:34 am บอร์ด Microsoft Office Knowledge & line & Etc
0
11
ส 25 พฤษภาคม 2019 11:34 am โดย teenproza7
ราศีที่ 13
โดย jamepiyawat ส 25 พฤษภาคม 2019 11:22 am บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
8
ส 25 พฤษภาคม 2019 11:22 am โดย jamepiyawat
ทำไมเราถึงเห็นน้ำอยู่กลางถนนนะ?
โดย jamepiyawat ส 25 พฤษภาคม 2019 10:34 am บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
9
ส 25 พฤษภาคม 2019 10:34 am โดย jamepiyawat
งานประจำวันที่ 25 พฤษภาคม 2562
โดย nanthiya ส 25 พฤษภาคม 2019 10:21 am บอร์ด M085 - นางสาวนันทิยา ศรีเพียงจันทร์
4
46
ส 25 พฤษภาคม 2019 7:51 pm โดย nanthiya
งานประจำวันที่ 25 พฤษาภาคม 2562
โดย jamepiyawat ส 25 พฤษภาคม 2019 10:07 am บอร์ด M084 - นายปิยวัช เชาว์วิมล
3
25
ส 25 พฤษภาคม 2019 8:15 pm โดย mindphp
งานประจำวันที่ 25 พฤษภาคม 2562
โดย teenproza7 ส 25 พฤษภาคม 2019 9:52 am บอร์ด M082 - ยศนันท์ ปันคำ
1
11
ส 25 พฤษภาคม 2019 7:40 pm โดย teenproza7
ทดลองสอบ TOEIC ก่อนไปลงสนามจริง
โดย teenproza7 ศ 24 พฤษภาคม 2019 7:33 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
27
ศ 24 พฤษภาคม 2019 7:33 pm โดย teenproza7
แก้เมารถ ขี้เมารถ ขึ้นรถทีไรลำบากตลอด
โดย teenproza7 ศ 24 พฤษภาคม 2019 7:10 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
22
ศ 24 พฤษภาคม 2019 7:10 pm โดย teenproza7
ใส่เงาให้กับตัวอักษร
โดย jamepiyawat ศ 24 พฤษภาคม 2019 6:06 pm บอร์ด CSS Knowledge
0
22
ศ 24 พฤษภาคม 2019 6:06 pm โดย jamepiyawat
ความรู้และประสบการณ์ก่อนเริ่มงาน
โดย nanthiya ศ 24 พฤษภาคม 2019 5:58 pm บอร์ด M085 - นางสาวนันทิยา ศรีเพียงจันทร์
0
8
ศ 24 พฤษภาคม 2019 5:58 pm โดย nanthiya