CSS box-shadow প্রতিশব্দ
- পূর্বপাতা box-reflect
- পরবর্তী পৃষ্ঠা box-sizing
পরিভাষা ও ব্যবহার
box-shadow বৈশিষ্ট্য ফ্ল্যাক্সকে একটি বা একাধিক শাড়া যোগ করে。
টিপস:ব্যবহার করে দেখুন border-image-* বৈশিষ্ট্যকে সুন্দর এবং স্কেলেবল বাটন তৈরি করুন!
আরও দেখুন:
CSS3 শিক্ষাCSS3 বর্তন
HTML DOM পরিচ্ছেদboxShadow বৈশিষ্ট্য
উদাহরণ
div ইলেকট্রন কে box-shadow যোগ করুন:
div
{
box-shadow: 10px 10px 5px #888888;
}
পাতার নিচে আরও উদাহরণ আছে。
CSS 语法
box-shadow: h-shadow v-shadow blur spread color inset;
মন্তব্য:box-shadow বৈশিষ্ট্য ফ্ল্যাক্সকে একটি বা একাধিক শাড়া যোগ করে।এই বৈশিষ্ট্যটি কমা দ্বারা বিভক্ত শাড়া তালিকা দ্বারা নির্দেশ করা হয়, যা দুই থেকে চারটি দৈর্ঘ্য মান, অপশনাল রঙ মান এবং অপশনাল inset কীওয়ার্ড দ্বারা নির্দেশ করা হয়।দৈর্ঘ্য মান সরাসরি ০ হয়।
প্রতিভূত মান
| মান | বর্ণনা | পরীক্ষা |
|---|---|---|
| h-shadow | অপরিহার্য।অনুক্রমিক শাড়ার অবস্থান।পয়সা মানকে অনুমোদন করা হয়নি。 | পরীক্ষা |
| v-shadow | অপরিহার্য।সাপেক্ষিক শাড়ার অবস্থান।পয়সা মানকে অনুমোদন করা হয়নি。 | পরীক্ষা |
| blur | অপশনাল।ভুল দূরত্ব | পরীক্ষা |
| spread | অপশনাল।শাড়ার মাপ | পরীক্ষা |
| color | অপশনাল।শাড়ার রঙ | পরীক্ষা |
| inset | অপশনাল।বাইরের শাড়া (outset) কে অভ্যন্তরীণ শাড়া (inset) হিসাবে পরিবর্তন করুন。 | পরীক্ষা |
টেকনিক্যাল বিবরণ
| ডিফল্ট: | none |
|---|---|
| প্রবর্তন: | no |
| সংস্করণ: | CSS3 |
| JavaScript 语法： | object.style.boxShadow="10px 10px 5px #888888" |
আরও উদাহরণ
- টেবিলের উপরে ফেলা ছবি
- এই উদাহরণটি কিভাবে 'পলারয়' ছবি তৈরি করা যায় এবং ছবিটিকে ঘুরিয়ে দেওয়া যায় তা দেখায়。
ব্রাউজার সমর্থন
টেবিলের সংখ্যাগুলি এই বৈশিষ্ট্যটির পূর্ণ সমর্থনকারী প্রথম ব্রাউজার সংস্করণকে নির্দেশ করে。
এই সংখ্যাগুলি -webkit- বা -moz- দ্বারা প্রদত্ত হয়, যা প্রিফিক্স ব্যবহারের প্রথম সংস্করণকে ইনডিকেট করে。
| Chrome | IE / Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| 10.0 4.0 -webkit- |
9.0 | 4.0 3.5 -moz- |
5.1 3.1 -webkit- |
10.5 |
- পূর্বপাতা box-reflect
- পরবর্তী পৃষ্ঠা box-sizing
