ดีครับดอทคอม

ดีครับดอทคอม

Python ตอนที่ 50 ตรวจสอบว่า String เป็นตัวอักษรและตัวเลขทั้งหมดหรือไม่ ด้วยเมธอด isalnum()

ตรวจสอบว่า String เป็นตัวอักษรและตัวเลขทั้งหมดหรือไม่ ด้วยเมธอด isalnum()

เมธอด isalnum() เป็นเมธอของสตริง มีไว้สำหรับตรวจสอบว่า อักขระในสตริงเป็นตัวอักษรและตัวเลข (alphanumeric) ทั้งหมดหรือไม่ ซึ่งตัวอักษรและตัวเลขในที่นี้หมายถึง ตัวอักษร (a-z) และตัวเลข (0-9) ตัวอย่างอักขระที่ไม่ใช่ตัวอักษรก็เช่น ช่องว่าง (space) ! # % & ? และอักขระอื่น ๆ ที่นอกเหนือจาก ตัวอักษร (a-z) และตัวเลข (0-9) โดยถ้าตรวจสอบแล้ว อักขระในสตริงเป็นตัวอักษรและตัวเลข (alphanumeric) ทั้งหมด จะคืนค่าเป็น True แต่ถ้าไม่ จะคืนค่าเป็น False รูปแบบการใช้งานเมธอด isalnum() จะเป็นดังนี้ เมธอดนี้ไม่มีพารามิเตอร์…

Python ตอนที่ 51 ค้นหาข้อความใน String ด้วยเมธอด index()

ค้นหาข้อความใน String ด้วยเมธอด index()

ใน Python เราสามารถค้นหาข้อความหรือตัวอักษรในสตริงได้โดยการใช้เมธอด index() ซึ่งจะให้ผลลัพธ์เป็นตำแหน่งที่ข้อความหรือตัวอักษรที่ระบุปรากฏในสตริงเป็นครั้งแรก แต่ถ้าไม่เจอจะเกิดข้อผิดพลาด เมธอด index() จะทำงานคล้าย ๆ กับเมธอด find() แตกต่างกันตรงที่ เมธอด find() จะคืนค่ากลับมาเป็น -1 ในกรณีที่หาข้อความไม่เจอ รูปแบบการใช้งานเมธอด index() จะเป็นดังนี้ ตัวอย่างการใช้งานเมธอด index() การใช้งานเมธอด index() แบบไม่ระบุค่า start และ end จากตัวอย่าง ค่า x จะเท่ากับ 10 เพราะค้นเจอคำว่า great ครั้งแรกที่ตำแหน่ง 10 (นับเริ่มจาก 0)…

กำหนดรูปแบบการแสดงผล HTML Elements ด้วย CSS

กำหนดรูปแบบการแสดงผล HTML Elements ด้วย CSS

CSS ย่อมาจาก Cascading Style Sheets ใช้สำหรับกำหนดว่าอีลิเมนต์ของ HTML แต่ละอีลิเมนต์ จะแสดงผลอย่างไรบนหน้าจอหรือสื่ออื่น ๆ อีกทั้งยังช่วยย่นระยะเวลาในการตกแต่งอีลิเมนต์ต่าง ๆ ได้อย่างมาก เพราะเราสามมรถใช้ CSS ตกแต่งอีลิเมนต์ในหลาย ๆ เว็บเพจได้จากที่เดียว หรือการเขียนโค้ดเพียงครั้งเดียว เราสามารถใช้งาน CSS ใน HTML ได้ 3 ทาง ดังนี้ โดยวิธีที่นิยมที่สุดคือวิธีที่ 3 คือแบบ External เขียน CSS ไว้ในไฟล์อื่นแยกต่างหาก แล้วค่อยนำเข้ามาใช้ในหน้าเว็บเพจแต่ละหน้า จะทำให้เกิดความสะดวกสบาย เพราะเราสามารถเขียนโค้ด CSS เพียงครั้งเดียว แต่สามารถนำไปใช้งานได้หลายที่…

HTML HSL Colors การใช้งานสีแบบ HSL ในเอชทีเอ็มแอล

ใน HTML เราสามารถใช้งานสีแบบ HSL โดยที่ H คือ Hue ได้แก่เนื้อสี S คือ Saturation ได้แก่ความอิ่มของสี และ L คือ Lightness ได้แก่ความสว่าง ซึ่งสามารถใช้งานได้ในรูปแบบ Hue คือ ค่าของเนื้อสี ซึ่งสามารถระบุได้ตั้งแต่ 0 – 360 โดยที่ 0 คือสีแดง 120 คือสีเขียว และ 240 คือสีน้ำเงิน Saturation คือค่าเปอร์เซ็นต์ของความอิ่มของสี โดยที่ 0% หมายถึงโทนสีเทา และ…

HTML HEX Colors การใช้งานสีแบบ HEX ใน HTML

HTML HEX Colors การใช้งานสีแบบ HEX ใน HTML

ใน HTML เราสามารถใช้งานสีโดยการระบุรหัสสีเป็นตัวเลขฐานสิบหก ในรูปแบบ #rrggbb โดยที่ rr หมายถึงสีแดง (Red) ส่วน gg หมายถึงสีเขียว (Green) และ bb หมายถึงสีน้ำเงิน (Blue) และสามารถระบุค่าตัวเลขฐานสิบหกให้สีแต่ละสีได้ตั้งแต่ค่า 00 จนถึง ff เช่น #ff0000 หมายถึง สีแดง เพราะค่าสีแดง rr ถูกกำหนดให้เป็นค่าสูงสุดคือ ff ส่วนค่าสีอื่น ๆ ถูกกำหนดให้เป็น 00 จึงทำให้ได้สีออกมาเป็นสีแดงอย่างเดียว ตัวอย่างการกำหนดค่าสีแบบ HEX สีที่ได้จากโค้ดด้านบน #ff0000 #0000ff #3cb371…

สี ชื่อสี ค่าสี RGB และรหัสสี HEX ใน HTML

สี ชื่อสี ค่าสี RGB และรหัสสี HEX ใน HTML

ใน HTML เราสามารถใช้สีได้หลายรูปแบบ โดยวิธีที่นิยมคือ การระบุชื่อสี การระบุรหัสสี Colors Code ในรูปแบบเลขฐานสิบหก HEX และ การระบุค่าสีแบบ RGB (Red, Green, Blue) ตัวอย่างการใช้สีแบบระบุชื่อสี การใช้งานสีแบบระบุชื่อสี สามารถระบุชื่อสีลงไปตรง ๆ ได้เลย ดังตัวอย่าง Tomato Orange DodgerBlue MediumSeaGreen Gray SlateBlue Violet LightGray ตัวอย่างการใช้งานสีแบบ RGB การใช้งานสีแบบ RGB สามารถทำได้โดยการระบุค่าสีทั้ง 3 สี โดยมีรูปแบบ RGB(Red, Green,…

HTML RGB Colors การใช้งานระบบสี RGB

HTML RGB Colors การใช้งานระบบสี RGB

ใน HTML เราสามารถกำหนดสีแบบ RGB ได้ ในรูปแบบ โดยพารามิเตอร์ (red, green, blue) ใจระบุความหนาแน่นของสีแต่ละค่าคือ (แดง, เขียว, น้ำเงิน) ซึ่งสามารถระบุได้ระหว่าง 0-255 ตัวอย่างเช่น ถ้าเราระบุเป็น rgb(255, 0, 0) จะได้สีแดง เพราะพารามิเตอร์ตัวแรกคือ red ถูกกำหนดเป็นค่าสูงสุดคือ 255 ส่วนสีอื่น ๆ (เขียวและน้ำเงิน) ถูกกำหนดเป็น 0 ถ้าต้องการสีดำ ให้กำหนดพารามิเตอร์ทุกตัวเป็น 0 ดังนี้ rgb(0, 0, 0) แต่ถ้าต้องการสีขาว ให้กำหนดพารามิเตอร์ทุกตัวเป็น…

HTML Colors ระบบสีในภาษาเอชทีเอ็มแอล

HTML Colors ระบบสีในภาษาเอชทีเอ็มแอล

ระบบสีใน HTML สามารถใช้งานได้โดยการระบุเป็นชื่อสี (Colors Name) หรือระบุค่าสีในระบบสีต่าง ๆ เช่น RGB, HEX, HSL, RGBA, HSLA Color Names การใช้งานสีโดยระบุชื่อสี ใน HTML เราสามารถเรียกใช้งานสีโดยระบุเป็นชื่อสีนั้น ๆ ได้เลย เช่น ตัวอย่างสีที่ได้จากการระบุชื่อสี Tomato Orange DodgerBlue MediumSeaGreen Gray SlateBlue Violet LightGray สีพื้นหลัง เราสามารถกำหนดสีพื้นหลังให้กับอีลิเมนต์ต่าง ๆ ได้โดยกำหนดชื่อสีให้กับ background-color เช่น ตัวอย่าง DCRUB Dot…

Python ตอนที่ 52 จัดรูปแบบข้อความ ด้วยเมธอด format()

จัดรูปแบบข้อความ ด้วยเมธอด format()

เมธอด format() เป็นเมธอดของสตริง ใช้สำหรับจัดรูปแบบการแสดงผลของสตริงที่กำหนด ซึ่งเมื่อจะนำไปแสดงผล ต้องแสดงผลใน placeholder ซึ่งจะถูกกำหนดไว้ภายในเครื่องหมาย curly brackets {} ดังนี้ {price:.2f} รูปแบบการใช้งานเมธอด format() placeholder ตำแหน่งที่จะใช้แสดงค่าที่จะจัดรูปแบบ placeholder คือตำแหน่งที่เราจะจองไว้สำหรับการแทรกค่าที่นำมาจัดรูปแบบ ซึ่งจะถูกกำกับด้วยเครื่องหมาย {} ซึ่งอาจจะเป็นชื่อตัวแปร เช่น {price} , และอินเด็กซ์ เช่น {0}, placeholders เปล่า ๆ แบบนี้ {} ก็ได้เช่นกัน ตัวอย่างการใช้งานเมธอด format() รูปแบบต่าง ๆ My name…

Python ตอนที่ 53 ค้นหาข้อความใน String ด้วยเมธอด find()

ค้นหาข้อความใน String ด้วยเมธอด find()

เมธอด find() เป็นเมธอดของสตริง ที่ใช้สำหรับค้นหาคำที่ต้องการในสตริง โดยจะคืนค่ากลับมาเป็นตัวเลขบอกตำแหน่งของคำที่ระบุ ที่ปรากฏครั้งแรกในสตริง เช่น ถ้าหาคำว่า Python และมีคำนี้อยู่ในสตริง 2 ครั้ง จะได้ผลลัพธ์เป็นตำแหน่งของคำว่า Python ที่ปรากฏครั้งแรกเท่านั้น แต่ถ้าไม่มีคำที่ค้นหาอยู่ในสตริง จะคืนค่ากลับมาเป็น -1 รูปแบบการใช้งานเมธอด find() จะเป็นดังนี้ ตัวอย่างการใช้งานเมธอด find() จากโค้ดตัวอย่าง ผลลัพธ์จะเป็น 19 เพราะตำแหน่งที่ค้นเจอคำว่า Love ครั้งแรก อยู่ที่ตัวอักษรลำดับที่ 19 (นับเริ่มจาก 0) ในสตริง ตัวอย่างการใช้งานเมธอด find() แบบระบุตำแหน่งเริ่มต้นและตำแหน่งสิ้นสุด จากโค้ดตัวอย่าง ให้ค้นหาคำว่า Love…

Python ตอนที่ 54 กำหนดขนาด Tab ในสตริง ด้วยเมธอด expandtabs()

กำหนดขนาด Tab ในสตริง ด้วยเมธอด expandtabs()

โดยปกติ เมื่อต้องการแทรกแท็บ (Tab) ในสตริง เราสามารถทำได้โดยการแทรกอักขระพิเศษ “\t” เข้าไปในสตริงได้เลย ดังนี้ จากโค้ด ได้ทำการแทรก ‘\t’ ไว้ระหว่างตัวอักษรทุกตัว ทำให้เมื่อแสดงผลลัพธ์ออกมา จะมีการแทรกแท็บ (Tab) ระหว่างตัวอักษรทุกตัว เมธอด expandtabs() เป็นเมธอดของสตริง ใช้สำหรับกำหนดขนาดของแท็บ (Tab) ที่ถูกแทรกเข้าไปในสตริงโดยการใช้อักขระ “\t” อีกที มีรูปแบบการใช้งานดังนี้ ตัวอย่างการใช้งานเมธอด expandtabs() จะเห็นได้ว่า ผลลัพธ์ของทั้ง 2 คำสั่งจะต่างกัน ตัวอย่างการใช้งานเมธอด expandtabs() แบบระบุพารามิเตอร์ tabsize ผลลัพธ์ที่ได้จะแตกต่างกันออกไป ตามค่าพารามิเตอร์ที่ระบุ การใช้เมธอด expandtabs() โดยระบุพารามิเตอร์…

Python ตอนที่ 55 ตรวจสอบว่า String ลงท้ายด้วยข้อความที่ระบุหรือไม่ ด้วยเมธอด endswith()

ตรวจสอบว่า String ลงท้ายด้วยข้อความที่ระบุหรือไม่ ด้วยเมธอด endswith()

เมธอด endswith() เป็นเมธอดของสตริง ใช้สำหรับตรวจสอบว่า สตริงนั้น ๆ ลงท้ายด้วยตัวอักษรหรือข้อความที่ระบุหรือไม่ โดยจะคืนค่าเป็น True หรือ False มีรูปแบบการใช้งานดังนี้ เมธอด endswith() มีพารามิเตอร์ 3 ตัว คือ ตัวอย่างการใช้เมธอด endswith() แบบไม่ระบุค่า start และ end จากตัวอย่าง จะเป็นการค้นหาคำที่ระบุในสตริง ตั้งแต่ตัวอักษรตัวแรกไปจึงถึงตัวสุดท้าย ผลลัพธ์จะเป็น False เพราะสตริงไม่ได้ลงท้ายด้วยคำว่า Python (มี . ต่อท้าย) ตัวอย่างการใช้เมธอด endswith() แบบระบุค่า start จากตัวอย่าง จะเป็นการค้นหาคำที่ระบุในสตริง…

Python ตอนที่ 56 เข้ารหัสข้อความ ด้วยเมธอด encode()

เขียนโปรแกรมภาษา Python ตอนที่ 56 เข้ารหัสข้อความ ด้วยเมธอด encode()

เมธอด endcode() เป็นเมธอดของสตริง ใช้สำหรับเข้ารหัสสตริงโดยเราสามารถกำหนดรูปแบบสำหรับการเข้ารหัสเองได้ แต่ถ้าเราไม่กำหนดรูปแบบ ไพธอนจะใช้ UTF-8 ในการเข้ารหัสโดยอัตโนมัติ โดยมีรูปแบบการใช้งานดังนี้ พารามิเตอร์ของเมธอด endcode() มีดังนี้ ตัวอย่างการใช้งานเมธอด encode() แบบไม่ระบุพารามิเตอร์ b’My name is St\xc3\xa5le’ ตัวอย่างการใช้งานเมธอด encode() แบบระบุพารามิเตอร์ ผลลัพธ์ b’\xff\xfeM\x00y\x00 \x00n\x00a\x00m\x00e\x00 \x00i\x00s\x00 \x00S\x00t\x00\xe5\x00l\x00e\x00′ ตัวอย่างการใช้งานเมธอด encode() แบบระบุ errors จากโค้ดตัวอย่าง เป็นการใช้งานเมธอด encode() โดยใช้ ascii encoding ผลลัพธ์จะแสดง error ที่แตกต่างกัน…

Python ตอนที่ 57 ตรวจสอบว่าข้อความที่กำหนดปรากฏใน String กี่ครั้ง ด้วยเมธอด count()

ตรวจสอบว่าข้อความที่กำหนดปรากฏใน String กี่ครั้ง ด้วยเมธอด count()

เมธอด count() เป็นเมธอดของสตริง ใช้สำหรับตรวจสอบว่ามีคำที่ระบุปรากฏอยู่ในสตริงต้นทางกี่ครั้ง มีรูปแบบการใช้งานดังนี้ พารามิเตอร์ของเมธอด count() มีดังนี้ ตัวอย่างการใช้เมธอด count() โดยระบุพารามิเตอร์เพียงตัวเดียว (value) 2 ตัวอย่างการใช้เมธอด count() โดยไม่ระบุค่า end 1 ตัวอย่างการใช้เมธอด count() โดยระบุพารามิเตอร์ครบทั้ง 3 ตัว 1

Python ตอนที่ 58 จัดตัวอักษรให้อยู่กึ่งกลางด้วยเมธอด center()

จัดตัวอักษรให้อยู่กึ่งกลางด้วยเมธอด center()

เมธอด center() เป็นเมธอดของสตริง สำหรับจัดตัวอักษรให้อยู่กึ่งกลาง โดยต้องระบุจำนวนความยาวของอักขระเป็นพารามิเตอร์ไปด้วย แล้วสตริงที่เรากำหนดจะถูกจัดให้อยู่กึ่งกลางของจำนวนอักขระที่กำหนด มีรูปแบบการใช้งานดังนี้ เมธอด center() ต้องการพารามิเตอร์ 2 ตัว ตัวอย่างการใช้งานเมธอด center() โดยระบุพารามิเตอร์เพียงตัวเดียวคือ length ตัวอย่างการใช้งานเมธอด center() โดยระบุพารามิเตอร์ครบทั้งสองตัว

Python ตอนที่ 59 แปลงอักษรเป็นตัวพิมพ์เล็กด้วยเมธอด casefold()

เขียนโปรแกรมภาษา Python ตอนที่ 59 แปลงอักษรเป็นตัวพิมพ์เล็กด้วยเมธอด casefold()

casefold() เป็นเมธอดของ string ที่มีหน้าที่ในการแปลงตัวอักษรภาษาอังกฤษให้กลายเป็นตัวพิมพ์เล็ก ( lower case ) โดยตัวอักษรทั้งหมดในสตริงนั้นจะถูกแปลงเป็นตัวพิมพ์เล็ก โดยมีรูปแบบการใช้งานดังนี้ เมธอดนี้สามารถใช้งานได้เลยโดยไม่ต้องระบุพารามิเตอร์ใด ๆ ทั้งสิ้น ดังตัวอย่าง ผลลัพธ์ hello my friends. welcome to my world.

Python ตอนที่ 60 แปลงตัวอักษรตัวแรกในประโยคเป็นตัวพิมพ์ใหญ่ด้วยเมธอด capitalize()

เขียนโปรแกรมภาษา Python ตอนที่ 60 แปลงตัวอักษรตัวแรกในประโยคเป็นตัวพิมพ์ใหญ่ด้วยเมธอด capitalize()

เมธอด capitalize() เป็นเมธอดของ string ใช้สำหรับแปลงตัวอักษรตัวแรกในประโยคให้เป็นตัวอักษรพิมพ์ใหญ่ ซึ่งมีรูปแบบการใช้งานดังนี้ สามารถใช้งานได้โดยไม่ต้องระบุพารามิเตอร์ใด ๆ ดังนี้ ผลลัพธ์ Hello my friends. แต่ถ้าในสตริงของเรามีประโยครวมกันอยู่หลายประโยค เพียงประโยคแรกเท่านั้นที่จะถูกแปลงให้อักษรตัวแรกเป็นตัวพิมพ์ใหญ่ จะไม่มีผลกับประโยคถัด ๆ ไป เช่น Hello my friends. welcome to my world. หรือถ้าสตริงของเราขึ้นต้นด้วยตัวเลข ก็จะไม่มีการแปลงตัวอักษรตัวใดเป็นตัวพิมพ์ใหญ่เช่นกัน ดังตัวอย่าง 300 is price of this product.

HTML Comment การเขียนคอมเมนต์ในภาษาเอชทีเอ็มแอล

HTML Comment การเขียนคอมเมนต์ในภาษาเอชทีเอ็มแอล

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

HTML Quotation การทำข้อความอ้างอิงในเอชทีเอ็มแอล

HTML Quotation การทำข้อความอ้างอิงในเอชทีเอ็มแอล

การทำข้อความอ้างอิงแบบสั้น เราสามารถทำได้โดยการใช้แท็ก <q> ซึ่งเบราเซอร์จะแทรกเครื่องหมายดับเบิ้ลโควตครอบข้อความที่อยู่ภายในแท็ก <q> ดังนี้ ทำข้อความอ้างอิงด้วยแท็ก <blockquote> การทำข้อความอ้างอิงด้วยแท็ก <blockquote> เป็นการอ้างอิงข้อความที่มาจากแหล่งอื่น เบราเซอร์จะจัดย่อหน้าข้อความที่อยู่ภายในแท็ก <blockquote> เข้าไปด้านในเล็กน้อย ดังตัวอย่าง กำกับตัวอักษรย่อด้วยแท็ก <abbr> การใช้แท็ก <abbr> กำกับตัวอักษรย่อ ช่วยให้เราสามารถอธิบายว่าตัวอักษรย่อนั้นย่อมากจากอะไร ซึ่งจะมีประโยชน์ต่อระบบแปลภาษา หรือระบบเสิร์ชเอ็นจิน โดยมีรูปแบบการใช้งานดังนี้ จัดรูปแบบข้อมูลการติดต่อด้วยแท็ก <address> เราสามารถใช้แท็ก <address> จัดรูปแบบข้อมูลการติดต่อ โดยมีรูปแบบการใช้งานดังนี้ จัดรูปแบบ Work Title ด้วยแท็ก <cite> เราสามารถจัดรูปแบบ Work Title ด้วยแท็ก <cite>…

HTML Formatting การจัดรูปแบบตัวอักษร

HTML Formatting การจัดรูปแบบตัวอักษร

HTML Formatting การจัดรูปแบบตัวอักษรในภาษา HTML สามารถทำได้โดยการใช้แท็กต่าง ๆ เช่น แท็ก <b> ใช้ทำตัวหนา แท็ก <i> ใช้ทำตัวเอียง เป็นต้น ทำตัวหนาด้วยแท็ก <b> และ <strong> แท็ก <b> ใช้สำหรับทำตัวอักษรเป็นตัวหนา (bold text) โดยที่ไม่มีระดับความสำคัญใด ๆ มีรูปแบบการใช้งานดังนี้ แท็ก <strong> ใช้สำหรับทำตัวอักษรเป็นตัวหนา (strong text) และเพิ่มดับความสำคัญเชิงความหมาย ( semantic importance ) ด้วย มีรูปแบบการใช้งานดังนี้ ทำตัวเอียงด้วยแท็ก <i>…

Python ตอนที่ 66 ข้อมูลประเภทรายการ List

เขียนโปรแกรมภาษา Python ตอนที่ 66 ข้อมูลประเภทรายการ List

ข้อมูลประเภทคอลเล็คชั่น Collections ในภาษาไพธอน มีอยู่ 4 ประเภท ดังนี้ List ข้อมูลประเภทลิสต์ ในภาษาไพธอน List ลิสต์ คือ ชุดข้อมูลแบบคอลเล็คชันที่มีการเรียงลำดับ และสามารถแก้ไขได้ โดยการสร้างข้อมูลแบบ List ในภาษาไพธอน จะใช้เครื่องหมาย square brackets [] ครอบชุดข้อมูล ตัวอย่างการสร้างข้อมูลแบบ List ผลลัพธ์ [‘iPhone’, ‘Samsung’, ‘Vivo’] หรืออีกวิธีหนึ่ง เราสามารถสร้างลิสต์ได้โดยการใช้คอนสตรัคเตอร์ list() ซึ่งมีรูปแบบการใช้งานดังนี้ [‘Swift’, ‘C++’, ‘Python’, ‘Java’, ‘Kotlin’, ‘HTML’, ‘Objective-C’,…

HTML Styles การจัดรูปแบบสไตล์

HTML Styles การจัดรูปแบบสไตล์

ในภาษา HTML เราสามารถใช้แอททริบิวต์ style เพื่อกำหนดสไตล์ให้ตัวอักษร รูปภาพ หรืออื่น ๆ ได้ ซึ่งมีรูปแบบการใช้งานดังนี้ การกำหนดสีพื้นหลัง ด้วย background-color เราสามารถใช้ css property ที่ชื่อว่า background-color เพื่อกำหนดสีพื้นหลังให้อิลิเมนต์ได้ ดังนี้ การกำหนดสีอักษร ด้วย color เราสามารถกำหนดสีตัวอักษรด้วย css property ที่ชื่อว่า color ดังตัวอย่าง กำหนดฟอนต์ตัวอักษรด้วย font-family เราสามารถกำหนดฟอนต์ตัวอักษรให้ข้อความได้ด้วย css property ที่ชื่อว่า font-family ดังนี้ กำหนดขนาดฟอนต์ด้วย font-size เราสามารถกำหนดขนาดตัวอักษรด้วย…

HTML Paragraphs การทำย่อหน้าในเอชทีเอ็มแอล

HTML Paragraphs การทำย่อหน้าในเอชทีเอ็มแอล

ในภาษา HTML เราสามารถขึ้นย่อหน้าใหม่ได้โดยใช้แท็ก <p> ซึ่งมีรูปแบบการใช้งานดังนี้ แต่เราจะไม่สามารถกำหนดได้ว่า ผลลัพธ์จะให้ออกมาแบบที่เราต้องการ เช่น เราขึ้นบรรทัดใหม่ หรือจัดรูปแบบข้อความในย่อหน้ามาอย่างดี รูปแบบเหล่านั้นจะถูกตัดออกหมด เช่น ผลลัพธ์ จากตัวอย่าง ถึงแม้ว่าเราจะจัดรูปแบบให้แสดงข้อความมีการเว้นวรรค มีการขึ้นบรรทัดใหม่ แต่เวลาแสดงผล การจัดรูปแบบเหล่านั้นจะถูกตัดออกทั้งหมด และข้อความจะถูกแสดงอยู่ในแถวเดียวกัน HTML Line Breaks การขึ้นบันทัดใหม่ ถ้าต้องการขึ้นบรรทัดใหม่ในย่อหน้าเดียวกัน ให้ใช้แท็ก <br> หรือ <br /> ดังนี้ ผลลัพธ์ จากตัวอย่าง เมื่อเราใช้แท็ก <br> ข้อความจะขึ้นบรรทัดใหม่ตามที่เราต้องการได้อย่างถูกต้อง การจัดรูปแบบด้วยแท็ก <pre> จากปัญหาที่เกิดขึ้นเมื่อใช้แท็ก <p> คือ…

HTML Headings การกำหนดหัวเรื่องในเอชทีเอ็มแอล

HTML Headings การกำหนดหัวเรื่องในเอชทีเอ็มแอล

การกำหนดหัวเรื่อง Heading ให้กับเนื้อหาใน HTML เราจะใช้แท็ก <h1> <h2> ถึง <h6> ซึ่งขนาดตัวอักษรจะเริ่มจากใหญ่ และเล็กลงตามลำดับ เป็นตัวบ่งบอกความสำคัญของหัวเรื่องนั้น ๆ ไปในตัวด้วย ตัวอย่างเช่น หัวเรื่องหรือ Heading นี้ถือว่ามีความสำคัญมากสำหรับการพัฒนาเว็บไซต์ เพราะมีผลด้าน SEO ด้วยเช่นกัน เพราะ Search engines จะใช้ Heading นี้ในการจัดโครงสร้างของเนื้อหาในเว็บเพจ ดังนั้น การเลือกใช้ Heading ควรพิจารณาและจัดลำดับความสำคัญให้ดี โดย <h1> จะมีความสำคัญสูงสุด ไล่ลำดับลงไปเรื่อย ๆ จนถึง <h6>