কম্পিউটার টিউটোরিয়াল

CSS ::placeholder দিয়ে টেক্সটবক্সের প্লেসহোল্ডার রঙ পরিবর্তন করা


CSS ::placeholder সিউডো-এলিমেন্ট ব্যবহার করে আমরা টেক্সটবক্সের প্লেসহোল্ডার টেক্সটের রঙ পরিবর্তন করতে পারি।

CSS ::placeholder সিউডো-এলিমেন্টের সিনট্যাক্স নিচে দেওয়া হলো:

::placeholder { attribute: /*value*/ }

উদাহরণ

নিচের উদাহরণগুলো CSS :: placeholder সিউডো-এলিমেন্ট ব্যাখ্যা করে।

<!DOCTYPE html> <html> <head> <style> input:last-child::placeholder {    color: cornflowerblue; } </style> </head> <body> <input type="text" placeholder="Default color" /> <input type="text" placeholder="Check my new color :D" /> </body> </html>

আউটপুট

এটি নিচের ফলাফল দেবে:

CSS ::placeholder দিয়ে টেক্সটবক্সের প্লেসহোল্ডার রঙ পরিবর্তন করা

উদাহরণ

<!DOCTYPE html> <html> <head> <style> input::placeholder {    color: fuchsia; } input {    margin: 2%;    width: 100%; } div {    display: flex;    flex-direction: column;    margin: 3%;    padding: 3%;    text-align: center;    align-items: center;    box-shadow: inset 0 0 30px brown; } button {    width: 40%; } </style> </head> <body> <div> <input type="text" placeholder="Normal placeholder" /> <input type="email" placeholder="somenone@somewhere.com" /> <button>dummy btn</button> </div> </body> </html>

আউটপুট

এটি নিচের ফলাফল দেবে:

CSS ::placeholder দিয়ে টেক্সটবক্সের প্লেসহোল্ডার রঙ পরিবর্তন করা

  1. CSS text-decoration-color দিয়ে লিংক আন্ডারলাইন রঙ পরিবর্তন করা

  2. CSS caret-color ব্যবহার করে কーソর রঙ পরিবর্তন করা

  3. উইন্ডোজ ১০-এ টাস্কবার কালার পরিবর্তন: ধাপে ধাপ গাইড

  4. Windows 11 টাস্কবারের রঙ সহজে কাস্টমাইজ করুন: ধাপে ধাপে গাইড