চিত্রগুলি আপনার ওয়েব পৃষ্ঠাগুলিতে জীবন জুড়ুন এবং দর্শকদের মনোযোগ আকর্ষণ করুন। ক্যাপশনগুলি আপনার ওয়েব চিত্রগুলি সম্পর্কে অতিরিক্ত তথ্য সরবরাহ করে, তবে উন্নত HTML এবং CSS দক্ষতা ছাড়াই ওয়েব পৃষ্ঠাগুলিতে যুক্ত করা কঠিন হতে পারে। এখানে এমন একটি চিত্রের একটি সহজ, এখনো আকর্ষনীয়, ক্যাপশন যুক্ত করার জন্য একটি নির্ভরযোগ্য পদ্ধতি রয়েছে যা আপনি ওয়েবপৃষ্ঠাতে যেখানেই এটি সরান সেখানে ছবির সাথে থাকে।
একটি এইচটিএমএল ইমেজ ক্যাপশন পদক্ষেপ
-
আপনার ওয়েব পেজ একটি ছবি যোগ করুন।
-
আপনার ওয়েবপেজের জন্য এইচটিএমএল, ইমেজ চারপাশে একটি ডিভ্যাগ ট্যাগ রাখুন:
-
ডিভি ট্যাগ একটি শৈলী বৈশিষ্ট্য যোগ করুন:
শৈলী = ""> -
প্রস্থ শৈলী সম্পত্তি দিয়ে, চিত্রের মতো একই প্রস্থে ডিভিটির প্রস্থ সেট করুন:
-
আশেপাশের পাঠ্যের তুলনায় সামান্য ছোট ক্যাপশনগুলির জন্য, ডিভ শৈলীতে ফন্ট-আকারের সম্পত্তি যুক্ত করুন:
-
যদি তারা চিত্রের নিচে কেন্দ্রীভূত হয় তবে ক্যাপশনগুলি সেরা দেখায়, তাই শৈলী বৈশিষ্ট্যতে একটি টেক্সট-অ্যালাইন সম্পত্তি যোগ করুন:
-
অবশেষে, ছবিতে একটি প্যাডিং-নীচে শৈলী সম্পত্তির সাথে শৈলী বৈশিষ্ট্য যোগ করে চিত্র এবং ক্যাপশনটির মধ্যে একটু অতিরিক্ত স্থান যোগ করুন:
শৈলী = "প্যাডিং-নীচে: 0.5em;" />
-
তারপরে ছবির নীচে সরাসরি পাঠ্য ক্যাপশন যুক্ত করুন:
আপনার সার্ভারে ওয়েবপেজ আপলোড করুন এবং ব্রাউজারে এটি পরীক্ষা করুন।
ক্যাপশন টিপস
- সিএসএস মাত্রা বিভিন্ন পরিমাপে হতে পারে, তাই আপনি সাধারণত পরিমাপ টাইপ অন্তর্ভুক্ত করা আবশ্যক। উদাহরণ স্বরূপ:
প্রস্থ: 100px আকারে; যাইহোক, HTML ইমেজ মাত্রা সর্বদা পিক্সেলগুলিতে থাকে, তাই আপনি পরিমাপ বন্ধ করুন।
প্রস্থ = "100"
- যদি আপনি চিত্রের প্রস্থের চেয়ে বিভাজকটির প্রস্থকে প্রস্থ করেন তবে চিত্রটির পাশে ক্যাপশন প্রদর্শিত হতে পারে। যদি আপনি চান, তাহলে একটি যোগ করুন
সরাসরি ক্যাপশন এবং ইমেজ ট্যাগ পরে।
