หลายคนอาจจะคิดว่า Contrast ในงานกราฟิกดีไซน์เป็นเพียงการใช้สีคู่ตรงข้ามหรือสีขาวตัดดำหรือภาพที่มีการไล่น้ำหนักอ่อนแก่ตัดกันมากๆเท่านั้น… Show
แต่ที่จริงแล้ว Contrast มีวิธีการนำไปใช้กับการออกแบบได้หลากหลายกว่าที่คิด ซึ่งที่เราหมายถึงไม่ใช่แค่การจัดการกับภาพถ่ายหรือโทนสีเท่านั้นแต่มันรวมถึงองค์ประกอบต่างๆที่ประกอบเข้าด้วยกันจนเป็นดีไซน์หนึ่งชิ้น ซึ่งมีองค์ประกอบที่แตกต่างกันแต่ถูกนำมารวมกันอย่างเหมาะสมเกิดสมดุลระหว่างสองสิ่งและทำให้งานออกแบบชิ้นนั้นดูน่าสนใจขึ้นด้วย แต่แน่นอนว่าเรื่องของสีสัน ความคมชัด และการไล่ระดับความเข้มอ่อนก็เป็นส่วนสำคัญอยู่แล้ว แต่ในบทความความนี้เราจะพาไปดูเทคนิคอื่นๆสำหรับการสร้าง Contrast ให้กับงานได้เปิดกว้างหลากหลายมากขึ้น มันคือเบสิคแห่งการคอนทราสต์ เพราะมันคือการเลือกใช้สีที่มีความสว่างกับความมืดมาตัดกัน เราไม่ได้หมายถึงสีคู่ตรงข้ามแต่มันคือน้ำหนักของสีนั้นๆที่เมื่อมองเป็นสีขาว-ดำมันจะเป็นความสว่างหรือมืดเท่านั้น ซึ่งมันอาจจะเป็นสีเดียวกันก็ได้แต่เมื่อเติมสีขาวเข้าไปก็สว่างขึ้น เติมสีดำเข้าไปก็เข้มขึ้นเท่านั้นเอง ตัวอย่าง เราจะเห็นว่าภาพด้านล่างมีโทนสีเดียวคือออกม่วงน้ำเงิน แต่ตัดกันกันด้วยส่วนที่เป็นเงามืดและส่วนที่โดนแสงจนสว่าง แต่โดยภาพรวมฉากหลังก็ถูกค่าความสว่างกดไว้ไม่ให้มีความขาวที่สุด เพื่อให้ตัวหนังสือสีขาวที่มีค่าความสว่างมากที่สุดได้เด่นออกมาจากฉากหลังนั้นได้ 02. Contrast ด้วยวงล้อสีสัน (Color Hue) อันนี้เป็นเรื่องของสีแล้วล่ะครับมันคือวงล้อสี วงล้อสีเกิดขึ้นจากเนื้อสีจริงๆที่ผสมกันจนเป็นสีต่างๆในวงล้อหรือที่เราเรียกกันว่าวงจรสีนั่นแหละ ซึ่งแต่ละสีที่มีค่าความสดอิ่มไม่เท่ากันก็เพราะขึ้นอยู่กับค่าความสว่าง/มืดของมันด้วยเช่นกัน โดยวิธีง่ายๆในการใช้งานสีจากวงจรสีก็แแค่เอาวงล้อมาดูว่าสีไหนต้องใช้ตรงข้ามกับสีไหน ซึ่งมีวิธีการจับคู่สีดังนี้ • Monochromatic สีโทนเย็น : ก็เลือกสีเดียวในโทนเย็นมาปรับค่าความสว่าง/มืด • Analogous สีโทนร้อน : ก็เลือกสีเดียวในโทนร้อนมาปรับค่าความสว่าง/มืด • Complementary สีคู่ตรงข้าม : ก็เลือกสองสีที่อยู่ตรงข้ามกันเป๊ะๆเลย ตัวอย่างสีคู่ตรงข้าม
• Split-Complementary สามสีเข้ากันได้ : คือการเลือกใช้ชุดสีสามสีที่เลือกจากสี่คู่ตรงข้ามแล้วขยับไปเลือกใช้สีที่อยู่ก่อนหน้าและถัดไปในวงล้อสีโทนใดโทนหนึ่ง • Triadic สามสีตรงข้าม: คือชุดสีที่ใช้สามสีจากการลากเส้นเป็นสามเหลี่ยมด้านเท่าในวงล้อสี • Tetradic คู่ตรงข้ามสองชุด: คือการใช้ชุดสีคู่ตรงข้ามสองชุดที่อยู่ใกล้กันในวงล้อสีมาใช้ทำให้มีสีหลักรวมกัน 4 สีนั่นเอง การนำไปใช้ไม่จำเป็นต้องใช้เนื้อสีตามวงล้อเป๊ะๆก็ได้ เพราะเมื่อนำมาใช้กับความมืด/สว่าง หรือ เข้ม/อ่อน ก็สามารถสร้างความหลากหลายของสีคู่ตรงข้ามได้เช่นกัน 03. Contrast ด้วยอุณหภูมิสี (Temperature)สีทั้งหมดสามารถแบ่งกลุ่มตามอุณหภูมิออกเป็น 3 แบบคือ โทนร้อนให้ความอบอุ่น (แดง,ส้ม,เหลือง) โทนเย็นให้ความเย็น (น้ำเงิน,เขียว) และโทนเทาที่อยู่ตรงกลางสามารถเป็นโทนไหนก็ได้อยู่การเลือกผสมอุณหภูมิสีเข้าด้วยกันนอกจากการนำสีร้อนมาคู่กับสีเย็นแล้ว เรายังสารมารถใช้ประโยชน์จากสีที่มีอุณหภูมิกลางมาสร้างความน่าสนใจได้เช่นเดียวกัน ตัวอย่าง การออกแบบเว็บไซต์นี้เราจะเห็นว่ามีการใช้สีพื้นหลังเป็นสีเย็นอย่างสีฟ้า และเน้นความเด่นของตัวคนและปุ่มด้วยสีเหลืองทำให้สีเสื้อและปุ่มเด่นขึ้นมามากแต่ภาพก็ดูกลมกลืนไม่ขัดตาเพราะอุณหภูมิสีของทั้งสองจะมีความเอียงไปทางโทนเย็น เพราะมีเขียวปนอยู่นิดๆทำให้ดูเข้ากันดี 04. Contrast ด้วยความเข้มของสี (Intensity)
เรารู้จัก Intensity ของสีในการเรียกอย่างติดปากว่าคือความสด มันคือสีที่เมื่อมีค่าความบริสุทธิ์แบบ 100% จะเป็นสีหลักของมันเอง ที่เมื่อมีความสว่างสดอิ่มเต็มที่ แล้วถูกเพิ่มความเทาด้วย Desaturated เข้าไปจะทำให้ความสดอิ่มของสีลดลงมาได้ถึง 0% คือสีเทาเลย เราใช้ประโยชน์ของระดับความสว่างนี้ช่วยการออกแบบที่ขับเน้นให้สีที่สด 100% เด่นออกมาจากส่วนอื่นที่สดน้อยกว่าได้เช่นกัน ตัวอย่าง เว็บไซน์นี้ออกแบบโดยการวางตัวหนังสือสีแดงสดลงบนพื้นหลังที่เป็นรูปป่าสีเขียวซึ่งถูกลดทอนความสดจนเกือบเทาแต่ก็ไม่เทาเพราะยังคงเห็นความเขียวอยู่ นี่แหละคือ Intensity ที่ถูกลดลงเพื่อสร้าง Contast 05. Contrast ด้วยรูปทรง (Shape) Organic vs. Geometricรูปทรงของสิ่งต่างๆสามารถจำแนกออกเป็น 2 ลักษณะใหญ่ๆคือ Organic รูปทรงเรขคณิต ( สี่เหลี่ยม,สามเหลี่ยม,วงกลม ฯลฯ) และ Geometric รูปทรงอิสระ (รูปทรงอิสระเช่นของเหลว,ธรรมชาติ,เส้นฟรีฟอร์ม) การใช้ความเรียบของรูปทรงเรขาคณิตมาใช้ร่วมกับรูปทรงอิสระจึงจัดเป็นทางเลือกที่น่าสนใจเหมือนการเอาความนิ่งมาตัดกับความสนุกสนานนั่นเอง ตัวอย่าง ฉลากสินค้าชิ้นนี้ที่ใช้รูปทรงง่ายๆอย่างวงกลมและสามเหลี่ยมเป็นตัวครอบรูปทรงอิสระที่อยู่ช้างในทำให้ภาพดูสะดุดตาขึ้นมา 06. Contrast ด้วยรูปทรง (Shape) Edges & Corners
นี่ก็เป็นอีกหนี่งวิธีในการใช้รูปทรง คือการออกแบบกับกราฟิกต่างๆที่มีรูปร่างเป็นกล่องมีเหลี่ยมมีมุมทั้งตัวกราฟิกกรอบ เส้นขอบหรือรูปแบบตัวอักษรที่มีลักษณะแข็งกระด้างมาจัดวางร่วมกับสิ่งที่ดูอ่อนช้อยกว่าเช่น สี่เหลียมมุมมนนั่นเอง ในตัวอย่างจึงนำตัวอักษรลักษณะมุมมนดูนุ่มนิ่มมาวางในกรอบที่เป็นสี่เหลี่ยมมุมแหลมเป็นต้น ตัวอย่าง Typography นบนก็แสดงให้เห็นว่าฟ้อนสองแบบที่มีความแข็งกับความพริ้วใหวมาอยู่ร่วมกันได้อย่างน่าสนใจ 07. Contrast ด้วยพื้นผิว (Texture)
เช่นเดียวกันกับรูปทรงเพราะการใช้พื้นผิวที่แตกต่างก็สามารถสร้าง Contrast ดีๆได้เช่นกัน ด้วยการเลือกพิ้นผิวที่มีความขรุขระมาผสมกับกับภาพที่มีพื้นผิวเรียบเนียนได้ในหลายวิธีทั้งการจัดเลเอาต์แบบภาพกับตัวหนังสือ หรือการพิมพ์แบบพิเศษหรือการแบ่งเนื้อหากราฟิกด้วยพื้นผิวก็ล้วนน่าสนใจในการประยุกต์ใช้ ตัวอย่าง การออกแบบของภาพนี้แสดงให้เห็นว่าภาพแฮมเบอร์เกอร์ที่ถูกถ่ายมาอย่างสะอาดเนี้ยบกริบ เมือถูกแปะทับด้วย Typo ขรุขระสไตล์ย้อนยุดก็สร้างมิติอารมณ์ Contrast ได้ 08. Contrast ด้วย ขนาดและสัดส่วน (Scale & Size)
ในการออกแบบนั้นแน่นอนว่าเราใช้เรื่องขนาดและสัดส่วนเป็นเครื่องมือในการสื่อสารกันอยู่แล้ว โดยเฉพาะกับกราฟิกที่ต้องการเน้นหรือไม่เน้น แต่การนำมาใช้กับการสร้าง Contrast ก็ยิ่งน่าสนใจเช่นกันด้วยการใข้รูปทรงที่ดูคล้ายๆกันแค่ปรับขนาดให้แตกต่างกันนอกจากช่วยสร้างความโดดเด่นให้ดีไซน์แล้ว ยังช่วยขยายใจความสำคัญออกไปได้ด้วย ตัวอย่าง ปกแมกกาซีนชิ้นนี้ออกแบบโดยเน้นความใหญ่โตของชิ้นแฮมเบอเกอร์ที่เด่นกว่าตัวอักษรต่างๆในหน้า แต่ก็ไม่ได้ทำให้ตัวหนังสือเหล่านั้นถูกทอนความสนใจลงไปแต่อย่างใดกลับทำให้องค์ประกอบดูสมบูรณ์มากขึ้นเสียอีก 09. Contrast ด้วยจุดเด่น (Visual Weight)
คือการออกแบบที่เน้นการชี้นำรูปแบบขับเน้นองค์ประกอบที่เป็นจุดเด่นในภาพซึ่งไม่ได้หมายถึงแค่ขนาดใหญ่เท่านั้น แต่มันหมายถึงสีสันและรูปแบบที่เด่นออกมาจากภาพรวม เป็นส่วนที่ต้องการเน้นให้ชัดโฟกัสให้มาก ซึ่งส่วนใหญ่คือเนื้อหาสำคัญหรือ Call to action ของภาพนั่นเอง ตัวอย่าง นี่คือชุดโปสการ์ดโปรโมทการท่องเที่ยวที่เอาภาพแลนด์มาร์กสำคัญมาทำภาพกราฟิกที่เด่นสุดทางด้านซ้าย แต่ก็ใช้สีกับตัวหนังสือทางฝั่งขวาเพื่อเน้นเนื้อหาที่สนุกสานต้องการให้เป็นไฮไลต์ด้วยในธีมสดใสเช่นกัน 10. Contrast ด้วยที่ว่างและพื้นขาว (Spacing & White Space)
เรื่องของ Space และ White Space จัดว่าเป็นสิ่งสำคัญในการออกแบบแทบทุกอย่าง ซึ่งรวมไปถึงการสร้าง Contrast ด้วยเช่นกัน เพราะมันคือการกำหนดระยะห่างและระยะชิดขององค์ประกอบต่างๆอย่างเหมาะสม หากมากหรือน้อยไปก็ย่อมทำให้ภาพรวมดูไม่น่าสนใจ แต่หากใช้ Space ด้วย”ความมาก” และ “ความน้อย”มาช่วยการออกแบบก็สามารถสร้างองค์ประกอบที่ดูดึงดูดสายตาได้เช่นกัน ตัวอย่าง เว็บดีไซต์นี้เน้นพื้นขาวที่มี Space ค่อนข้างมากเพื่อขับความโดดเด่นของภาพแจกันตรงกลางในขณะที่ข้อมูลอื่นๆที่ถูกจัดวางเป็นระเบียบก็ดูอ่านง่ายสร้างอารมณ์มินิมอลเล็กๆได้ด้วย 11. Contrast ด้วยการจัดองค์ประกอบ (Compositional Choices)
บางครั้งการจัดวางองค์ประกอบภาพก็สร้าง Contrast ได้เหมือนกัน ด้วยการเลือกที่จะเล่นกับความสมดุลหรือทิศทางของกราฟิกต่างทั้งภาพ,ตัวอักษร และตำแหน่ง โดยเราสามารถใช้หลักกการของกฏการถ่ายภาพมาใช้ร่วมด้วยได้ตามตัวอย่าง• The Rule of Thirds กฏสามส่วน : ง่ายๆคือการแบ่งภาพออกเป็นสามส่วนทั้งแนวตั้งและแนวนอนและพยายามวางจุดโฟกัสของภาพใว้ในตำแหน่งที่เส้นทั้งหมดตัดกันซึ่งจะมีอยู่ 4 จุดด้วยกัน ตัวอย่าง ภาพแบนเนอร์บนสุดของเว็บไซต์ใช้หลักการกฏสามส่วนแบบเป๊ะๆเลยคือวางกลางดอกกุหลาบ ข้อความพาดหัว และปุ่ม Shop Now ใว้จรงจุดตัดพอดีๆ • Diagonals: คือการใช้เส้นนำทางสายตาของผู้ดูให้เคลื่อนไปตามทิศทางที่เราต้องการ ก็เพียงจัดวางสิ่งต่างให้อยู่ในทิศทางที่เราอยากนำเสนอเท่านั้น 12. Contrast ด้วยบางอย่างที่คาดไม่ถึง (Something Unexpected)
เพียงเพิ่มลูกเล่นเล็กๆน้อยๆที่คาดไม่ถึงลงไปบนภาพ ด้วยสิ่งที่อาจจะดูไม่เข้าพวกหรือหลุดออกไปจากความคาดหมายก็เป็นอีกวิธีในการสร้าง Contrast เหมือนกัน แต่ต้องระวังว่าองค์ประกอบที่วางลงไปไม่ทำให้งานดีไซน์ชิ้นนั้นหลุดจากธีมไปอย่างสิ้นเชิง และถ้าทำให้ดูกลมกลืนแต่สะดุดตาและเข้ากันดีกับองค์ประกอบเดิมแล้วหละก็จะยิ่งน่าประทับใจไปกันใหญ่ ตัวอย่าง ภาพนี้แค่วาง Typo ให้กรอบของตัวอักษรไปแอบอยู่หลังภูเขาในขณะที่ตัวอักษรมาลอยอยู่ด้านหน้าก็น่าสนใจแล้ว 13. Contrast ด้วยแพทเทิร์น (Repetition & Patterns)
เทคนิคการใช้องค์ประกอบมาทำซ้ำเป็น Pattern สามารถสร้างความโดดเด่นและน่าสนใจให้กับดีไซน์ได้เช่นกัน คล้ายๆกับการเทคคนิคการจัดองค์ประกอบ เพราะมันสามารถสร้างรูปแบบเฉพาะตัวขึ้นมาได้
ตัวอย่าง นามบัตรนี้คือตัวอย่างของการใช้ Pattern รูปหกเหลี่ยมสร้างสมดุลให้กับนามบัตรสะท้อนกราฟิกของโลโก้และยังสร้างความน่าสนใจให้ดีไซน์อีกด้วย 14. Contrast ด้วยตำแหน่งและการจัดวาง (Position & Orientation)การจัดวางลำดับของเนื้อหารวมไปถึงการจัดชิดด้านใดด้านหนึ่งก็เป็นอีกวิธีสร้าง Contrast ที่ได้ผลดี เพราะมันช่วยให้รูปแบบของดีไซน์ไม่ดูสม่ำเสมอจนราบเรียบน่าเบื่อเกินไปทำให้สามารถสร้างจุดเด่นได้แต่ก็ต้องระวังความไม่เรียบร้อยด้วยเหมือนกัน ควรใช้ Grid เข้ามาช่วยให้องค์ประกอบไปกันได้อย่างน่าสนใจด้วย 15. Contrast ด้วยความชิดและห่าง (Proximity & Separation)
คือการจัดกลุ่มกราฟิกหรือวัตถุในภาพที่เกี่ยวเนื่องกันให้อยู่รวมหรือแยกออกจากกัน มันคือการจัดระเบียบในส่วนต่างๆอย่างกลมกลืนแต่ก็ต้องน่าสนใจหรือทำให้ส่วนที่เน้นโดดเด่นออกมาได้มากพอ โดย Proximity คือการจัดให้ชิดกันเพื่อให้เป็นกลุ่มเดียวกัน และ Separation คือการขยับแยกกลุ่มก้อนนั้นแบ่งส่วนกัน ตัวอย่าง เรซูเม่ที่เห็นนี้ใช้สีและไอคอนในการแบ่งหัวข้อและเนื้อหาที่เป็นกลุ่มข้อความมาเรียงต่อกันอย่างไม่สะดุดแต่เข้าใจได้ง่ายเพราะมันชัดเจนในการเรียงลำดับ 16. Contrast ด้วยกราฟิกชี้นำ (Visual Cues)
คือการใช้กราฟิกที่เป็นภาพไม่ว่าจะภาพจริงหรือไอคอนสัญลักษณ์ต่างๆที่สื่อความหมายได้ สร้างความจดจำและเข้าใจได้ทันทีโดยไม่ต้องคิดมากเช่น ลูกศร , กราฟิกรูปสิ่งของต่างๆ รวมไปถึงการขีดเส้นใต้ , Bullet , หรือเส้นคั่นกับเส้นกรอบ นำสิ่งเหล่านั้นมาใช้ในการสร้างดีไซน์ที่สื่อสารเนื้อหาและรูปแบบที่คุณต้องการและไม่น่าเบื่อ
ตัวอย่าง ไอคอนด้านล่างที่สื่อความหมายของก้อนเนื้อหาใต้ไอคอนนั้นทำให้รู้เลยว่าโดยรวมๆเว็บไซต์นี้เกี่ยวกับอะไร และทำให้เนื้อหาน่าอ่านมากยิ่งขึ้น 17. Contrast ด้วยความซับซ้อนและเรียบง่าย (Complex & Simple Features)
เป็นการออกแบบที่นำความซับซ้อนกับความเรียบง่ายมาเจอกันที่ความลงตัวบางอย่าง กล่าวคือการดึงลักษณะเด่นๆของทั้งสองสิ่งมาผสมกันในสัดส่วนพอดีก็สามารถสร้าง Contrast ได้เช่นกัน ซึ่งความซับซ้อนที่ว่าก็หมายถึงภาพลวดลายหรือกราฟิกที่มีความปราณีตบรรจงด้วยรายละเอียดเยอะๆ มารวมเข้ากับองค์ประกอบแบบเรียบๆน้อยๆ ตัวอย่าง คือชุดสติ๊กเกอร์ที่ใช้ฉากหลังเป็นลายดอกไม้หลากสีสวยงามมาวางคู่กับ Typographic เรียบๆตัวหนังสือนิ่งๆบนพื้นสี่เหลี่ยมสีขาวก็ดูน่าสนใจ 18. Contrast ด้วยฟ้อนต์ต่างชนิด (Font Combinations)
การใช้ฟ้อนต์คนละแบบ คือแบบมีหัว (Serif) กับแบบไม่มีหัว (Sans Serif) มาจัดวางเข้าด้วยกันก็เป็นหนึ่งวิธีที่น่าลอง จริงๆก็รวมไปถึงฟ้อนประเภทอื่นๆด้วยเช่น แบบลายมือ (Hand Writing) แบบพาดหัว (Display) ก็สามารถนำมาใช้ร่วมกันสร้างดีไซน์แบบใหม่ๆได้เหมือนกัน แต่เคล็ดลับคือการเลือกฟ้อนต์คนละประเภทที่เข้ากันได้ เพราะไม่ใช่ทุกอย่างจะเข้ากันได้หมด ถ้ากำหนดธีมภาพรวมของงานได้ชัดเจนแต่แรกก็จะรู้ได้ว่าต้องการฟ้อนต์แบบไหนบ้าง ตัวอย่าง โลโก้นี้ใช้ฟ้อนถึง 3 แบบแต่ก็ดูเข้ากันและเก๋ไก๋ดีทีเดียว 19. ข้อควรระวังเมื่อใช้ Typography
ตัวอย่าง คือการใช้ฟ้อนที่หลากหลายก็จริงแต่ด้วยรูปแบบที่วาไรตี้สนุกสนานอยู่แล้วจึงดูเข้ากันดี 20. Contrasting ด้วยสไตล์และน้ำหนักตัวอักษร (Typography Style & Weight)
และสุดท้ายคือการใช้น้ำหนักความหนาบาง , ความเอียง , ความผอม , ความอ้วน ฯลฯ ของตัวอักษรมาสร้าง Contrast โดยแทบไม่ต้องออกแรงอะไรมากเลย แม้จะเป็นฟ้อนต์เดียวกันก็สร้างความน่าสนใจได้เหมือนกัน แค่ปรับน้ำหนักเล็กน้อย ใช้การเน้นส่วนที่ต้องการเน้นให้เด่นกว่าด้วยน้ำหนักที่หนาหรือบางกว่าส่วนอื่น จนเกิดความแตกต่างอย่างน่าสนใจนั่นเอง ตัวอย่าง เว็บไซต์นี้ออกแบบโดยกำหนดให้ Headline เป็นตัวหนาและส่วนเนื้อหาเป็นตัวบางในทุกช่อง เอาล่ะเมื่อคุณอ่านมาถึงบันทัดนี้คุณคงพอจะมีแนวทางหรืออาวุธไปใช้ในการดีไซน์ให้เกิด Contrast กันประมาณนึงแล้วหละ แต่สิ่งที่จำเป็นกว่าเทคนิคคือการฝึกฝนและหมั่นใช้งานบ่อยๆนะครับ ความชำนาญจะทำให้คุณไม่ต้องนั่งนึกเคล็ดลับอะไรเลยแต่คุณจะทำงานไปตามความรู้สึกซึ่งมันก็มาจากความเข้าใจในสิ่งที่เรียนรู้และฝึกฝนไปนี่แหละ เทคนิค 20 แบบนี้สามารถใช้ร่วมกันได้ แค่ลองปรับให้เข้ากันก็สามารถสร้างงานที่หลากหลาย มีทางเลือกได้ไม่จำกัดเลยทีเดียวและขอบคุณ Canva Design School เจ้าของบทความต้นทางด้วย การกําหนดรูปแบบตัวอักษรมีกี่วิธีการเปลี่ยนแบบตัวอักษร หมายถึง เปลี่ยนรูปร่างหน้าตา หรือ ลักษณะของตัวอักษร ซึ่งแต่ละแบบอักษรจะมีรูปร่างต่างกัน เช่น มีส่วนเว้า ส่วนโค้งของเส้นตัวอักษรไม่เหมือนกัน ซึ่งมีวิธีดังนี้. แบบอักษร ... . ขนาดแบบอักษร ... . ขยายขนาดแบบอักษร ... . ลดขนาดแบบอักษร ... . การเปลี่ยนตัวพิมพ์ ... . ล้างการจัดรูปแบบ ... . ลักษณะแบบอักษร ... . ขีดเส้นใต้. การกําหนดสีตัวอักษร HTML มีกี่แบบการกำหนดสีของตัวอักษร หรือข้อความที่ต้องการนั้น คำสั่งในภาษา HTML จะใช้ คุณสมบัติ (attribute) สำหลับกำหนดสีที่ชื่อ color. การกำหนดสีของตัวอักษรหรือข้อความ นั้นจะสามารถกำหนดได้ 2 แบบ ดังนี้ 1. กำหนดโดยใช้ชื่อสี เช่น red, yellow, blue หรือ pink เป็นต้น
คำสั่งกำหนดสีตัวอักษรคือข้อใดคําสั่งที่ใช ้กําหนดสีตัวอักษร คือ <FONT COLOR=” ”> ข้อความ </FONT> ในการกําหนดสีตัวอักษร มี 2 แบบ คือ 1.กําหนดโดยระบุชื่อของสีนั้น รูปแบบ <FONT COLOR="ระบุชื่อสีของสีนั้น"> ข้อความ </FONT> เช่น <FONT COLOR="RED"> ข้อความนี้เป็นสีแดง </FONT> <FONT COLOR="BLUE"> ข้อความนี้เป็นสีนํ้าเงิน </FONT>
คำสั่งกำหนดรูปแบบตัวอักษรคือข้อใดหากท่านต้องการกำหนดทั้งชื่อตัวอักษรและ ขนาดตัวอักษรพร้อมกัน สามารถเขียนคำสั่งได้ดังนี้ <font size="ขนาดตัวอักษร" face="ชื่อตัวอักษร">HTML</font> การกำหนดตัวเอียง ตัวหนา และ ตัวขีดเส้นใต้
|
การกําหนดสีของตัวอักษร มีกี่แบบ อะไรบ้าง
ลิขสิทธิ์ © 2024 th.ketiadaan Inc.
