อย่างการเขียนบล็อกนี้ สีตัวอักษรและพื้นหลังก็จะมีให้เลือกจำกัดเท่าที่เห็นด้านล่างนี้ค่ะ ถึงแม้จะมีให้เลือกอยู่แล้วหลายสี แต่บางทีก็เหมือนจะยังไม่พอ
ขั้นตอนการสร้างบทความและการเปลี่ยนสีตัวอักษร
1. ก่อนจะเปลี่ยนสีตัวอักษร เราต้องพิมพ์ข้อมูลต่าง ๆ ที่ต้องการอัปเดตให้เรียบร้อยทั้งหมดเสียก่อน ซึ่งสีอักษรที่เป็นค่าเริ่มต้นเจ้าของบล็อกตั้งค่าไว้ที่สีดำ ยกเว้นในส่วนที่เป็นลิงก์ได้ตั้งค่าไว้ที่สีแดง ที่มาที่ไปของภาพตัวอย่างด้านล่างก็ตัดมาจากส่วนหนึ่งในตอน 'วิธีฝังโค้ด HTML ลงใน Blog' นะคะ เดี๋ยวเราจะมาลองเปลี่ยนสีลิงก์ตรงที่ลูกศรชี้ให้เป็นสีอื่นที่นอกเหนือจากสีที่บล็อกกำหนดกัน
2. เข้าไปในส่วนแก้ไขบทความจะเห็นข้อความของเราที่เหมือนกับหน้าบทความ ให้คลิกช่อง HTML
3. เมื่อเข้ามาด้านใน HTML แล้ว จะเห็นตัวอักษรเยอะแยะไปหมดไม่ต้องตกใจค่ะ เพราะ Ctrl + F ช่วยได้ ถ้าย้อนกลับไปดูภาพตัวอย่างในข้อ1 คำที่อยู่ใกล้กับ 'RevolverMaps' คือคำว่า 'ตัวอย่างโค้ด HTML' ที่เจ้าของบล็อกเลือกคำนี้เพราะนอกจากจะอยู่ใกล้ที่สุดแล้วมันยังเด่นแล้วก็ไม่ซ้ำในหน้านี้ค่ะ (สังเกตคำว่า RevolverMaps จะมีอยู่หลายจุด)
หลังจาก Ctrl + F คำว่า 'ตัวอย่างโค้ด HTML' แล้วก็เจอเลย ลองเปรียบเทียบข้อมูลกับภาพในข้อ2 ดูจะเห็นว่าข้อมูลตรงกัน แต่มาในลักษณะภาษา HTML ...ที่เห็นลูกศรหลายจุดอันนั้นแค่ชี้ให้ดูเฉย ๆ นะคะว่าตรงไหนเป็นตรงไหน ส่วนที่สำคัญจริง ๆ คือในช่องสี่เหลี่ยมเพราะเราจะพิมพ์เปลี่ยนสีกันตรงจุดนี้
4. เลือกสีที่เราต้องการ สามารถดูรหัสสีได้ที่ Color Names & HTML Color Chart ค่ะ รหัสสีที่เราจะใช้เปลี่ยนจะพิมพ์ชื่อสีก็ได้ เช่น LightSkyBlue, DeepSkyBlue, DodgerBlue เป็นต้น หรือจะใส่เป็นโค้ดก็ได้แต่ต้องใส่ # นำหน้าด้วย เช่น #87CEFA, #00BFFF, #1E90FF เป็นต้น จะพิมพ์ตัวเล็กหรือตัวใหญ่ก็ได้ค่ะเดี๋ยวระบบจะแปลงเป็นตัวพิมพ์เล็กทั้งหมดให้เอง
5. Copy ชื่อสี หรือ โค้ดสีไปวางตรงจุดที่อยู่ในกรอบสีแดง ในตัวอย่างใส่ชื่อสี DeepSkyBlue จากนั้นคลิกกลับไปที่โหมด 'เขียน'
6. ระบบแก้ไขสีเรียบร้อยแล้วค่ะ
7. ลองเช็คที่หน้าบทความดู เห็นสีที่เปลี่ยนได้ชัดเจนค่ะ
การสร้างคำสั่งสีกรณีที่บทความนั้นมีแต่ตัวหนังสือ
1. ถ้าบทความที่เรากำลังพิมพ์มีแต่ตัวหนังสือหมดทั้งหน้า อย่างเช่นบทความในตอน [Talk] ภูมิใจเสนอ...โลกของคนกลัวหมา เมื่อเราคลิกเข้าไปในโหมด HTML ก็จะไม่มีคำสั่งอะไรมากค่ะ ตามภาพด้านล่างจะมีแค่คำสั่งวางไอคอน คำสั่งเว้นวรรค คำสั่งเว้นบรรทัด นอกนั้นก็เป็นข้อความที่เราพิมพ์
2. แล้วถ้าเราอยากจะเพิ่มสีทีหลัง ก็ให้คลุมดำไปบนข้อความที่เราต้องการแล้วคลิกที่สีอะไรก่อนก็ได้เพื่อให้เกิดคำสั่ง HTML ขึ้นมา (แต่จะเขียนเองก็ได้ค่ะคำสั่งจะเป็นแบบนี้ <span style="color: โค้ดสี;">ข้อความที่เราต้องการเปลี่ยนสี</span>)
3. เมื่อเปลี่ยนสีเบื้องต้นเรียบร้อยแล้ว ในโหมด HTML ก็จะมีคำสั่งสีขึ้นมาทันทีค่ะ
4. ถ้าไปดูที่หน้าบทความก็จะเห็นข้อความที่เป็นสีม่วง Magenta ตามที่เราเปลี่ยนเบื้องต้น
5. เดี๋ยวเรามาลองเปลี่ยนข้อความเป็นสีเขียว Olive (#808000) กันนะคะ กลับเข้าไปในโหมด HTML เหมือนเดิม Copy ชื่อสีหรือโค้ดสีแล้วก็วางทับชื่อสีเดิม จากนั้นคลิกกลับไปโหมดเขียน บันทึก แค่นี้ก็เรียบร้อยค่ะ
6. ที่หน้าบทความเราได้ข้อความสีเขียว Olive แล้วค่ะ
การเปลี่ยนสีด้วยภาษา HTML ก็จะมีประมาณนี้ และยังสามารถเข้าไปเลือกเฉดสีได้อีกมากมายที่นี่นะคะ HTML color codes เจ้าของบล็อกชอบเว็บไซต์นี้ เค้าทำเครื่องมือค้นหาโค้ดสีง่ายดีค่ะ
แนะนำวิธีสังเกตเมื่อเข้าไปในโหมด HTML
หากในอนาคตเพื่อน ๆ อยากเปลี่ยนสีตัวอักษรไม่ว่าจะเปลี่ยนจากที่ไหนก็ตาม แล้วเจอภาษา HTML ...ถ้าเป็นโค้ดที่เกี่ยวกับการเปลี่ยนสี จะเป็นคำสั่งแบบนี้ค่ะ เช่น
<span style="color: cyan;"> หรือ
<span style="background-color: #20124d;"> หรือ
<span style="background-color: #4c1130; color: white;"> เป็นต้น
ซึ่งทุกคำสั่งที่เกี่ยวกับสีจะมี color: อยู่ด้วย ตามตัวอย่างที่ยกมาจะมีทั้งชื่อสีและแบบโค้ดสีซึ่งใช้ได้เหมือนกัน ยกเว้นบางรูปแบบที่เค้าให้ใส่เป็นโค้ดเท่านั้น การไล่ดูภาษา HTML ก็ไม่ยากค่ะ คำสั่งมันก็มักจะซ้ำ ๆ กันนี่แหละ ถ้าจับจุดได้ก็จะเปลี่ยนอย่างอื่นได้อีก เช่น เพิ่มหรือลดขนาดวิดีโอ เป็นต้น
ที่เจ้าของบล็อกเข้าไปแก้ไขข้อมูลเองก็มีแค่เรื่องสีกับขนาดวิดีโอเท่านั้นค่ะ อย่างอื่นจะไม่ค่อยเข้าไปยุ่งเพราะกลัวทำโค้ดพัง เท่านี้เราก็จะได้ใช้สีที่หลากหลายกับงานเขียนกันแล้วค่ะ
ไม่มีความคิดเห็น:
แสดงความคิดเห็น