اس مضمون کے نتائج یہ ہیں:
شروع کرتے ہیں!
سی ایس ایس میں تصویر کا رنگ تبدیل کریں۔
سی ایس ایس میں تصویر کا رنگ تبدیل کرنے کے لیے پہلے فلٹر پراپرٹی اور اس کے افعال کے بارے میں جانیں۔ اس طرح آپ کو بہتر سمجھ حاصل ہوگی۔
CSS پراپرٹی کو فلٹر کریں۔
سی ایس ایس کی امیج فلٹر پراپرٹی کے بصری اثر کو کنٹرول کرنے کے لیے استعمال کیا جاتا ہے۔ بصری اثرات ہیں:
- دھندلا
- چمک
- رنگ ایڈجسٹمنٹ
- ڈراپ شیڈو
- دھندلاپن
فلٹر پراپرٹی کا نحو
فلٹر پراپرٹی کا نحو یہ ہے:
فلٹر : دھندلا ( ) | ڈراپ شیڈو ( ) | دھندلاپن ( )- دھندلا (): تصویر پر دھندلا اثر لگانے کے لیے استعمال کیا جاتا ہے۔
- ڈراپ شیڈو(): ایک تصویر پر سایہ بنائیں۔
- دھندلاپن (): تصویر میں شفافیت شامل کرنے کے لیے استعمال کیا جاتا ہے۔
ہم اس فلٹر کی خاصیت کا استعمال کرتے ہوئے متعدد فلٹرز استعمال کر سکتے ہیں۔ یہ مضمون تصویر کا رنگ تبدیل کرنے کے طریقہ کے بارے میں ہے، لہذا ہم یہاں یہ بتائیں گے کہ اس کے ساتھ ڈراپ شیڈو() اور اوپیسٹی() فنکشنز کو کیسے استعمال کیا جائے۔
ڈراپ شیڈو()
drop-shadow() CSS کا ایک بلٹ ان فنکشن ہے جو کسی بھی عنصر یا تصویر پر شیڈو سیٹ کرنے کی اجازت دیتا ہے۔ تصویر کا رنگ تبدیل کرنے کے لیے ڈراپ شیڈو() فنکشن میں درج ذیل پیرامیٹرز استعمال کیے جاتے ہیں۔
- آفسیٹ ایکس: یہ افقی سائے کو شامل کرنے کے لیے استعمال ہوتا ہے۔
- offset-y: اس کا استعمال کرتے ہوئے سائے عمودی طور پر شامل کیے جاتے ہیں۔
- رنگ: سائے اس پیرامیٹر کے ساتھ رنگین ہوتے ہیں۔
ان نکات کو واضح کرنے کے لیے، آئیے ڈراپ شیڈو کے نحو کی طرف چلتے ہیں:
ڈراپ شیڈو ( آفسیٹ ایکس آفسیٹ وائی رنگ )- offset-x اور offset-y مثبت یا منفی ہو سکتے ہیں۔
- افقی میں، مثبت قدر کا استعمال دائیں جانب کے اثرات کو شامل کرنے کے لیے کیا جاتا ہے، اور منفی کو بائیں جانب کے لیے استعمال کیا جاتا ہے۔
- عمودی میں، مثبت قدر نیچے والے حصے کے لیے ہے، اور منفی اوپر کے لیے ہے۔
- رنگ کی جگہ پر، آپ کسی بھی رنگ کو تفویض کر سکتے ہیں جو آپ تصویر کو دینا چاہتے ہیں۔
دھندلاپن ()
opacity() کا استعمال کسی عنصر یا کسی تصویر میں شفافیت شامل کرنے کے لیے کیا جاتا ہے۔ opacity() کا نحو ہے:
دھندلاپن ( نمبر ) ;یہاں ' نمبر ' میں s دھندلاپن کی سطح کو 0.0 سے 1.0 کے درمیان سیٹ کرنے کے لیے استعمال کیا جاتا ہے۔ کسی تصویر کو مکمل طور پر شفاف بنانے کے لیے، آپ اسے 0.0 کے طور پر سیٹ کر سکتے ہیں۔
مذکورہ بالا نکات کو واضح کرنے کے لیے، آئیے مثال کی طرف چلتے ہیں۔
سی ایس ایس میں تصویر کا رنگ کیسے تبدیل کیا جائے؟
ذیل کی مثال میں، پہلے، ہم ٹیگ کا استعمال کرتے ہوئے ایک تصویر شامل کریں گے:
< img کلاس = 'تصویر' src = 'image.jpg' سب کچھ = '' >
< / جسم >
فلٹر پراپرٹی کو لاگو کرنے سے پہلے، نتیجہ اس طرح تھا:
کسی تصویر کا رنگ تبدیل کرنے کے لیے، آئیے CSS پر جائیں اور اس پر فلٹر کی خاصیت کا اطلاق کریں۔ ہم تصویر کی شفافیت کے لیے دھندلاپن کو 0.5 پر سیٹ کریں گے۔ ڈراپ شیڈو() فنکشن میں آفسیٹ ایکس اور آفسیٹ وائی کی ویلیو 0 ہے کیونکہ ہم صرف تصویر کا رنگ تبدیل کرنا چاہتے ہیں۔
.تصویر {فلٹر : دھندلاپن ( 0.5 ) ڈراپ شیڈو ( 0 0 براؤن ) ;
}
عمل درآمد کے بعد حتمی نتیجہ یہ ہے:
تصویر کا رنگ کامیابی سے تبدیل کر دیا گیا ہے۔
نتیجہ
تصویر کے رنگ کو تبدیل کرنے کے لیے، دو CSS فنکشنز: اوپیسٹی() اور ڈراپ شیڈو() فلٹر پراپرٹی کے ساتھ استعمال کیے جاتے ہیں۔ opacity() امیج کی شفافیت کی وضاحت کرتا ہے اور ڈراپ شیڈو() تصویر کو رنگ اور شیڈو تفویض کرتا ہے۔ اس تحریر نے CSS کا استعمال کرتے ہوئے تصویر کا رنگ تبدیل کرنے کا طریقہ بتایا۔