চিত্রগুলি একটি ওয়েব পৃষ্ঠার একটি অত্যন্ত গুরুত্বপূর্ণ অংশ কারণ এটি একটি ওয়েব পৃষ্ঠার চেহারা উন্নত করে এবং গ্রাহকের মিথস্ক্রিয়া বৃদ্ধি করে। একাধিক ওয়েবসাইটের ইউএসপি হ'ল তারা কীভাবে তাদের ওয়েব পৃষ্ঠাগুলিতে বিভিন্ন চিত্র সংগঠিত করে এবং এতে স্বাদ যুক্ত করে। এই চিত্রগুলির নিবন্ধ, আমরা কীভাবে নিম্নলিখিত পৃষ্ঠায় এইচটিএমএল ব্যবহার করে কোনও ওয়েব পৃষ্ঠায় চিত্রগুলি এম্বেড করতে পারি তা বুঝতে পারি:
এইচটিএমএলে চিত্র কীভাবে যুক্ত করবেন
কোনও ওয়েবপৃষ্ঠায় কোনও চিত্র এম্বেড করতে HTML আপনাকে দেয় ট্যাগ আরেকটি গুরুত্বপূর্ণ বিষয় মনে রাখবেন,
ক্লোজিং ট্যাগ নেই। scr বৈশিষ্ট্যটি চিত্রের পথ নির্দিষ্ট করতে ব্যবহৃত হয়, যা সিস্টেম / সার্ভার থেকে url বা চিত্রের পথ হতে পারে। আসুন প্রথমে এইচটিএমএল ব্যবহার করে একটি ওয়েবপৃষ্ঠায় চিত্র এম্বেড করার প্রাথমিক বাক্য গঠন দিয়ে শুরু করি।
বাক্য গঠন
img src = 'img / front-end-web-વિકાસ / 50 / কি-এইচটিএমএল-চিত্র.png'>কোডের উদাহরণ
ওয়েবপৃষ্ঠায় এইচটিএমএল চিত্র এম্বেডিং চিত্রসমূহ
অন্যান্য ট্যাগগুলির মতো, এর সাথেও বিভিন্ন বৈশিষ্ট্য যুক্ত রয়েছে ট্যাগ আসুন আমরা তাদের প্রত্যেককে একে একে দেখি, তাদের প্রয়োজনীয়তা এবং কীভাবে সেগুলি ব্যবহার করব তা বুঝতে পারি।
এইচটিএমএল ইমেজ ট্যাগ
- Alt গুণ
Alt বৈশিষ্ট্যটি কোনও চিত্রের জন্য বিকল্প পাঠ্য। কেন এলটি অ্যাট্রিবিউট চালু হওয়ার কারণটি হ'ল যদি কোনও কারণে চিত্রটি লোড করতে না পারে তবে বিকল্প কোনও পাঠ্যটি চিত্রটি সম্পর্কে ধারণা দেয় appear চিত্র লোড না হওয়ার কারণগুলি হ'ল ধীরে ধীরে ইন্টারনেট সংযোগ হতে পারে বা চিত্র সরবরাহিত উত্সে বাস করে না ইত্যাদি be
যদি চিত্রটি এইচটিএমএল ফাইল যেখানে একই ফোল্ডারের ভিতরে থাকে তবে আপনি সরাসরি ফাইলটির নাম উল্লেখ করতে পারেন can অন্যথায়, আপনার কাছে ইমেজ ফাইলটির নিখুঁত পথ সরবরাহ রয়েছে।
Alt বৈশিষ্ট্যের মানটি চিত্রটি বর্ণনা করে।
উদাহরণ
ওয়েবপৃষ্ঠায় এইচটিএমএল চিত্র এম্বেডিং চিত্রসমূহ
জাভাতে এমভিসি অ্যাপ্লিকেশন উদাহরণ
- একটি চিত্রের প্রস্থ এবং উচ্চতা
শৈলীর বৈশিষ্ট্যটি কোনও চিত্রের উচ্চতা এবং প্রস্থ নির্ধারণ করতে ব্যবহৃত হয়। স্টাইল বৈশিষ্ট্যে আপনি সিএসএস স্টাইলিং নির্দিষ্ট করেন specify
ওয়েবপৃষ্ঠায় এইচটিএমএল চিত্র এম্বেডিং চিত্রসমূহ
এইচটিএমএল ব্যবহার করে কোনও ওয়েবপৃষ্ঠায় একটি চিত্র এম্বেড করার সময় কয়েকটি গুরুত্বপূর্ণ বিষয় হ'ল:
- প্রস্থ এবং উচ্চতার বৈশিষ্ট্যগুলি পিক্সেলগুলিতে সংজ্ঞায়িত করা হয়।
- আপনি শতাংশের সাথে কোনও চিত্রের প্রস্থ এবং উচ্চতাও নির্ধারণ করতে পারেন। এটি পুরো ওয়েবপৃষ্ঠা অনুযায়ী শতাংশ বিবেচনা করবে।
- আপনি যদি কেবলমাত্র তাদের মধ্যে একটি নির্দিষ্ট করে থাকেন তবে তা অন্যটিকে সেই অনুযায়ী সামঞ্জস্য করে।
- ইউআরএল ব্যবহার করে চিত্রগুলি এম্বেড করা হচ্ছে
এইচটিএমএল আপনাকে নমনীয়তা দেয় যেখানে আপনি কেবল URL নির্দিষ্ট করে অন্য সার্ভার থেকে চিত্রটি বেছে নিতে পারেন। আপনি ইমেজগুলি হোস্ট করতে আলাদা সার্ভার ব্যবহার করতে পারেন এবং তারপরে ইউআরএল ব্যবহার করে এই চিত্রগুলি এম্বেড করতে পারেন।
ওয়েবপৃষ্ঠায় এইচটিএমএল চিত্র এম্বেডিং চিত্রসমূহ
- লিঙ্ক হিসাবে চিত্র
আপনি কোনও লিঙ্ক হিসাবে চিত্রটি ব্যবহার করতে পারেন যেখানে ব্যবহারকারী চিত্রটিতে ক্লিক করতে এবং একটি নতুন ওয়েবপৃষ্ঠায় অবতরণ করতে পারে। এটি করতে, আপনাকে কেবল এটি স্থাপন করতে হবে দিন ইন ট্যাগ
সি ++ এ ফিবোনাচি
ওয়েবপৃষ্ঠায় এইচটিএমএল চিত্র এম্বেডিং চিত্রসমূহ
- চিত্র ভাসমান
আপনি সিএসএস ফ্লোট সম্পত্তি ব্যবহার করে চিত্রের প্রান্তিককরণও সামঞ্জস্য করতে পারেন। সমস্ত CSS বৈশিষ্ট্য শৈলীর বৈশিষ্ট্যে নির্দিষ্ট করা দরকার।
এইচটিএমএল চিত্র
- চিত্র মানচিত্র
এটি এইচটিএমএল সরবরাহকারী একটি গুরুত্বপূর্ণ বৈশিষ্ট্য। ট্যাগ একটি চিত্র-মানচিত্র সংজ্ঞায়িত করতে সহায়তা করে। আপনি নিশ্চয়ই ভাবছেন যে কোনও চিত্রের মানচিত্রটি কী। একটি চিত্র-মানচিত্র ক্লিকযোগ্য এলাকা সহ একটি চিত্র
এইচটিএমএল চিত্র
- পটভূমি চিত্র
আপনি কোনও ওয়েবপৃষ্ঠায় একটি পটভূমি চিত্র যুক্ত করতে পারেন। আপনাকে কেবল স্টাইল ট্যাগে সিএসএস সম্পত্তি অর্থ ব্যাকগ্রাউন্ড-চিত্র ব্যবহার করতে হবে এবং এটি এইচটিএমএল উপাদানটিতে যুক্ত করতে হবে।
এইচটিএমএল চিত্রপটভূমি চিত্র
দেহ উপাদান
এটির সাথে আমরা এই এইচটিএমএল ইমেজগুলি ব্লগের শেষে এসেছি।উপরের স্নিপেটগুলি কার্যকর করার পরে আপনি বুঝতে পারবেন কীভাবে এইচটিএমএলতে চিত্র sertোকানো যায়। আমি আশা করি এই ব্লগটি তথ্যবহুল এবং আপনার কাছে মূল্য সংযোজনযোগ্য।
আমাদের দেখুন যা প্রশিক্ষকের নেতৃত্বাধীন লাইভ প্রশিক্ষণ এবং বাস্তব জীবনের প্রকল্পের অভিজ্ঞতার সাথে আসে। এই প্রশিক্ষণটি আপনাকে ব্যাক-এন্ড এবং ফ্রন্ট-এন্ড ওয়েব প্রযুক্তিগুলির সাথে কাজ করার দক্ষতায় দক্ষ করে তোলে। এটিতে ওয়েব ডেভলপমেন্ট, জিক্যুয়ারি, অ্যাঙ্গুলার, নোডজেএস, এক্সপ্রেসজেএস এবং মঙ্গোডিবি প্রশিক্ষণ অন্তর্ভুক্ত রয়েছে।
আমাদের জন্য একটি প্রশ্ন আছে? দয়া করে এটি 'এইচটিএমএল চিত্রগুলি' ব্লগের মন্তব্য বিভাগে উল্লেখ করুন এবং আমরা আপনার কাছে ফিরে আসব।