ปรับหน้าเว็บเป็นขาวดําด้วย 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

วิธีป้องกันสแปมรบกวนใน iMessage

สําหรับผู้ใช้งาน iPhone ในช่วงนี้ได้รับข้อความสแปมใน iMessage ทําให้บางคนเกิมความกังวลในเรื่องของความปลอดภัย และเกิดความรำคาญ ในความเป็นจริงแล้วเราไม่ต้องสนใจ ไม่ต้องไปกด Link ต่างๆที่ส่งเข้ามาก็ได้ครับ ไม่มีผลกระทบใดๆกับเครื่องของเราแต่อย่างใด แต่สําหรับใครที่ยังรำคาญ เราก็สามารถ Setting เพื่อโยนข้อความ iMessage ที่ถูกส่งมาจากบุคคลอื่น (บุคคลที่ไม่ได้อยู่ในรายชื่อใน Contact ของเรา) แยกไปอยู่ใน Unknown Senders และก็จะไม่มีการแจ้งเตือนให้หน้ารําคาญ สามารถ Setting ได้ตามวิธีดังนี้ครับ

Vue.js เริ่มต้น ตอน5 (ทําความรู้จักกับ Props)

หลังจากที่เราเรียนรู้ Component กันไปแล้ว ถ้ายังจํากันได้ภายใน Component มี Option ตัวนึงชื่อว่า Props ซึ่งมีหน้าที่ รับข้อมูลจากภายนอก Component เข้ามาใช้งานภายใน Component โดยจะรับข้อมูลผ่านทาง Attribute การใช้งาน Props สามารถใช้งานได้หลายรูปแบบ เราจะมาเรียนรู้ไปทีละแบบนะครับ

การใช้งานคำสั่ง git clone

สวัสดีครับ บทความนี้จะมีเนื้อหาการใช้งานคําสั่ง git clone ครับ


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

Build with ❤️ and Astro.

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