ปรับหน้าเว็บเป็นขาวดําด้วย css

15 Oct 2016,
Share: 

ตามที่ทางสำนักพระราชวังได้มีประกาศ เรื่อง พระบาทสมเด็จพระปรมินทรมหาภูมิพลอดุลยเดช เสด็จสวรรคตนั้น อันเป็นเรื่องที่น่าโศกเศร้าสำหรับคนไทย เพื่อเป็นการแสดงความอาลัยตามความเหมาะสม ข้าพเจ้าขอแนะนำวิธีปรับเปลี่ยนหน้าเว็บไซต์ให้อยู่ในรูปแบบขาวดํา ตามความเหมาะสมเพื่อเป็นการไว้ทุกข์

วิธีปรับเปลี่ยนการแสดงผลหน้าเว็บเป็นขาวดํา

เนื่องจากเราต้องการปรับเปลี่ยนหน้าเว็บทั้งเว็บเป็นขาวดํา (Grayscale) เราต้องเขียน css เพิ่มเติมตรง tag body ดังนี้

body {
  /* IE */
  filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
  /* Chrome, Safari */
  -webkit-filter: grayscale(1);
  /* Firefox */
  filter: grayscale(1);
}

เลข 1 หมายถึง ปรับเป็น grayscale 100% สามารถเปลี่ยนเป็นค่าอื่นๆได้ เช่น 85%, 50%, 90% ฯลฯ ตัวอย่าง

body {
  /* IE */
  filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=85%);
  /* Chrome, Safari */
  -webkit-filter: grayscale(85%);
  /* Firefox */
  filter: grayscale(85%);
}

ถ้าต้องการจะเปลี่ยนเฉพาะบางจุด ก็สามารถทําเป็น class ไว้ก็ได้ครับ

ข้าพระพุทธเจ้าเว็บไซต์ ThitiBlog.com ขอน้อมส่งเสด็จสู่สวรรคาลัย

Suggestion blogs

ตัวหารร่วมมาก และการนำไปใช้

ตัวหารร่วมมาก (ห.ร.ม.) คือ ตัวหารร่วม (หรือตัวประกอบร่วม) ที่มีค่ามากที่สุด ที่นำไปหารจำนวนนับชุดใด(ตั้งแต่สองจำนวนขึ้นไป) ได้ลงตัว ต่อไปนี้เราจะเรียกว่าการหา ห.ร.ม. เช่น ห.ร.ม. ของ 8 และ 12 คือ 4 เพราะ 4 คือจำนวนที่มากที่สุดที่หารทั้ง 8 และ 12 ได้ลงตัว

Execute the php file and collect the output

ในบทความนี้ผมจะอธิบายวิธีการ Execte ไฟล์ php แล้วเอา output ไปใช้งานต่อ ตัวอย่างเช่น ถ้าเรามีไฟล์ cal.php สําหรับ ทําอะไรซักอย่าง แล้วเราต้องการจะเรียกใช้ไฟล์ดังกล่าวเพื่อเอาผลลัพธ์ไปใช้งาน เราจะสามารถเขียน code ได้ดังนี้

Vue.js เริ่มต้น ตอน1 (สร้าง Project)

ในยุคนี้การทําเว็บส่วนใหญ่จะเน้นไปทางการทำ Web ที่เป็น Single Page Application จึงมี Framework ที่มาช่วยในการทําเว็บแบบ Single Page Application ที่จะช่วยให้เราสร้างเว็บได้ง่ายขึ้น Vue.js ก็เป็น Framework ตัวนึงที่นิยมใช้กัน ซึ่งในบทความนี้เราจะมาเรียนรู้วิธีการใช้งาน Vue.js เบื้องต้น


Copyright © 2019 - 2025 thiti.dev |  v1.59.0 |  Privacy policy | 

Build with ❤️ and Astro.

Github profile   Linkedin profile   Instagram   X profile   Nostr   Youtube channel   Telegram   Email contact   วงแหวนเว็บ