Tipjano.Com
আমাদের সাইটে ভিজিট করার জন্য আপনাকে ধন্যবাদ। প্রতিটা টিউনে লাইক এবং আপনার মন্তব্য দেয়ার চেষ্টা করবেন।
Post Creator Info
Contributor
Online
's Bio

You don't have to be great to start, But,, You have to start to be great!!!!
Home » ওয়েব ডিজাইন » Html5 সব কিছু শিখুন ঘরে বসে পার্ট-২
Html5 সব কিছু শিখুন ঘরে বসে পার্ট-২

Html5 সব কিছু শিখুন ঘরে বসে পার্ট-২:প্রযুক্তি.কম

এ স্বাগতম।আসসালামু আলাইকুম।
সরাসরি পোস্ট এ চলে যাই:—,,

আবারও আসলাম Html5 সব কিছু শিখুন ঘরে বসে পার্ট-২ নিয়ে।

এইচটিএমএল প্যারাগ্রাফ

এখন আমরা প্যারাগ্রাফ ট্যাগ নিয়ে আলােচনা করবাে। এইচটিএমএল এ কোন টেক্সট লেখার জন্য সাধারণত
এইচটিএমএল প্যারাগ্রাফ ট্যাগ ব্যবহার করা হয়। প্যারাগ্রাফ ট্যাগ ব্যবহার করে আমরা টেক্সটকে কয়েকটি পারায় ভাগ
করতে পারি। এছাড়া, এটি এইচটিএমএল এর খুবই গুরুত্বপূর্ণ একটি ট্যাগ ।বিষয়টি পরিষ্কার করার
জন্য এখন একটি উদাহরণ দিচ্ছি । নিচের কোডটুকু Quoda তে লিখে
index.html নামে সেভ করুন;


এবার কোডটুকু একটি ব্রাউজারে প্রদর্শন করার দেখতে পারবেন যে আমরা যে টেক্সট ব্যবহার করেছি তা ২টি পারায়
ভাগ হয়ে গেছে।

এইচটিএমএল লাইনব্রেক

এইচটিএমএল লাইন ব্রেক ট্যাগ ব্যবহার করা হয় কোনো লাইন আরেক লাইন থেকে ভাগ করার জন্য। এইচটিএমএল এর, লাইব্রেক ট্যাগ অন্যান্য ট্যাগ এর মত নয় । লাইন ব্রেক ট্যাগটি লেখা হয়
এভাবে। বিষয়টি ভাল করে বুঝতে নিচের কোডটুকু লিখে index.html নামে সেভ করুন;

এবার index.html ফাইলটি ওপেন করে দেখুন লাইনসমূহ লাইন ব্রেক-আপ ট্যাগ অনুযায়ী শেষ হয়েছে। যদি লাইব্রেক ট্যাগ ব্যবহার করা ছাড়া উপরের কোডটুকুর আউটপুট ব্রাউজারে প্রদর্শন করানাে হতাে তাহলে কেমন দেখাতাে সেটা
জানতে লাইন ব্রেক আপ ট্যাগ কেটে দিয়ে আবার ব্রাউজারে প্রদর্শন করান। অর্থাৎ নিচের কোডটুকু index.html নামে
সেভ করুন;

এবার index.html ফাইলটি একটি ব্রাউজারে প্রদর্শন করান। তাহলে দেখতে পারবেন লাইনসমূহ নিচে ইচে সজ্জিত হয়নি
এইচটিএমএল হেডিং
এখন আমরা এইচটিএমএল হেডিং নিয়ে আলােচনা করবাে। আমরা যখন কোন কন্টেন্ট এরশিরােনাম লিখতে যাই তখন
আমরা এইচটিএমএল হেডিং ট্যাগ ব্যবহার করি। এইচটিএমএলএর হেডিং ট্যাগ ছয়টি। এখন আমরা ছয়টি হেডিং ট্যাগ এর
উদাহরণ দেখবাে। এজন্য নিচের কোডটুকু লিখে index.html নামে সেভ করুন;

এবার index.html ফাইলটি ব্রাউজারে প্রদর্শন করান তাহলে ছয়টি হেডিং দেখতে পারবেন। প্রতিটি হেডিং এর
পর এইচটিএমএল লাইন ব্রেক ট্যাগ ব্যবহার করেছি যেন কোডসমূহ একটির নিচে আরেকটি হয়।

এইচটিএমএল লিংক

ওয়েবসাইট এ এইচটিএমএল লিংক খুবই গুরুত্বপূর্ণ । আমরা যখন ওয়েবসাইট এ কোন লিংক দিতে চাই তখন
এইচটিএমএল লিংক ব্যবহার করে থাকি । আমরা অনেক সময় পােস্ট এ দেখি যে, সফটওয়্যারটি ডাউনলােড করতে
এখানে ক্লিক করুন’ এ রকম লেখা । তখন সাধারণত ‘এখানে’ লেখাটিতে একটি লিংক যুক্ত থাকে। ফলে, “এখানে’
লেখাটিতে ক্লিক করলে নতুন একটি লিংক ওপেন হয়। এ পদ্ধতিটি এইচটিএমএল লিংক এর মাধ্যমে করা হয় ।
ওয়েবসাইটের মেনুসহ প্রায় সব ধরনের কন্টেন্ট এ এইচটিএমএল লিংক ব্যবহার করা হয়। এইচটিএমএল এ লিংক ব্যবহার
করার জন্য Anchor (অ্যানকোর) ট্যাগ ব্যবহার করা হয় এবং সাথে href অ্যাট্রিবিউট ব্যবহার করা হয়।
এইচটিএমএল লিংক এর গঠন হচ্ছে;
Keyword
এইচটিএমএল লিংক সম্পর্কে ভালােভাবে বুঝতে নিচের কোডটুকু একটি টেক্সট এডিটর যেমন নােটপ্যাড প্লাস প্লাস এ
লিখে index.html নামে সেভ করুন;

একটা বিষয় খেয়াল রাখবেন, আপনার ইমেজ এবং এইচটিএমএল ফাইল যদি একসাথে থাকেতাহলে এই পদ্ধতিতে কাজ
করবে। যদি, আপনার index.html ফাইলটি ডেক্সটপ এ এবং ইমেজ ফাইল একটি images ফোল্ডার এর ভিতরে থাকে
তাহলে আপনাকে এভাবে লিখতে হবে।
যদি ফাইলের ডিরেক্টরি সঠিকভাবে না দেন এবং ফাইলের এক্সটেন্সান না দেন তাহলে ইমেজ এর আউটপুট ঠিকভাবে
আসবে না।

এইচটিএমএল লিস্ট ব্যবহার করে আপনি কোন কিছুর তালিকা প্রকাশ করতে পারেন। আমরা ওয়েবসাইটের মেনু তৈরি
করার সময় সাধারণত এইচটিএমএল লিস্ট ব্যবহার করেথাকি। এছাড়া, আমরা কোন কিছু পয়েন্ট আকারে লিখতে চাইলে
এইচটিএমএল লিস্টব্যবহার করি। এইচটিএমএল এ সাধারণত দুই ধরনের লিস্ট রয়েছে। এ দুইটি লিস্টহচ্ছে;

••Order List (অর্ডার লিস্ট)
••Unorder List ( আন অর্ডার লিস্ট)

Order List (অর্ডার লিস্ট): আমরা কোন তালিকা যখনক্রমিক সংখ্যা অনুযায়ী লিখে থাকি তখন আমরা এইচটিএমএল
অর্ডার লিস্ট ব্যবহারকরতে পারি। এখন একটা উদাহরণ দিলে ব্যাপারটি আপনাদের কাছে সম্পূর্ণ পরিস্কার হয়ে যাবে।
এজন্য নিচের কোডটুকু লিখে index.html নামে সেভ করুন;


কোড বিশ্লেষণঃ আমরা সাত নম্বর লাইনে ulব্যবহার করেছি। ul মানে হচ্ছে Un Order List এবং প্রতিটি লিস্ট
জন্য ul এর ভিতরে l ব্যবহার করা হয়।

আমরা যখন কোন তথ্য উপস্থাপন করি, সাধারণত আমরা টেবিল ব্যবহার করি। এছাড়া, বিভিন্ন ধরনের উপাত্ত উপস্থাপন
করার জন্য টেবিল ব্যবহার করে থাকি। একইভাবে, আমরা ওয়েবসাইটে কোন ধরনের উপাত্ত উপস্থাপন করার জন্য
এইচটিএমএল টেবিল ব্যবহার করে থাকি। এইচটিএমএল টেবিল কিছুটা জটিল। নতুনদের প্রথম প্রথম বুঝতে অসুবিধা হতে
পারে।
এইচটিএমএল এ টেবিল ব্যবহার করার জন্য এইচটিএমএল

“””

ট্যাগ ব্যবহার করতে হয়। প্রথমে চলুন
আমরা একটা উদাহরণ দেখে আসি পরে আমরা বিশ্লেষণ করবাে। এজন্য নিচের কোডটুকু লিখে index.html নামে সেভ
করুন;

কোড বিশ্লেষণঃ


১। আমরা প্রথমে ট্যাগ এর মাঝে border ব্যবহার করেছি। কেননা, এখানে আমরা টেবিল এর
বর্ডার নির্ধারণ করেছি। এজন্য আমরা বর্ডার ১ দিয়েছি। আপনি বর্ডার ২ ব্যবহার করে কোডটুকু রান করান। তাহলে বিষয়টি
পরিষ্কার হয়ে যাবে। আপনি যদি border ব্যবহার না করেন তাহলে বর্ডারবিহীন টেবিল ব্রাউজারে প্রদর্শিত হবে।
|
জােবাকে কালো
২। টেবিলের হেডার নির্ধারণ করার জন্য ব্যবহার করা হয়েছে।


৩। টেবিলের Row অর্থাৎ সারি নির্ধারণ করার জন্য ব্যবহার করা হয়েছে।


৪। টেবিলের সেল নির্ধারণ করার জন্য

ব্যবহার করা হয়েছে।

এইচটিএমএল ফর্ম

কোন ওয়েবসাইট এ রেজিস্টার ফর্ম যুক্ত করার জন্য
এইচটিএমএল ফর্ম ব্যবহার করা হয়।এইচটিএমএল ফর্ম তৈরি করার জন্য

ট্যাগ ব্যবহার করা হয় এবং

‘ ট্যাগ এর ভিতরে বেশ কিছু ট্যাগ ব্যবহার করা হয়।
টেক্সট ফিল্ড ওয়েবসাইট এ ফর্ম পূরণ করার সময় ভিজিটরকে বেশ কিছু তথ্য (যেমন; নাম, ই-মেইল, ঠিকানা ইত্যাদি) দিয়ে ফর্ম
সাবমিট করতে হয়। এসব কাজ আপনি টেক্সট ফিল্ড এর মাধ্যমে করতে পারেন।
এ সম্পর্কে আরও ভালােভাবে বুঝতে নিচের কোডটুকু লিখে index.html নামে সেভ করুন;

এবার index.html ফাইলটি একই ব্রাউজারে ওপেন করুন।

তো ভাই,আজ এই পর্যন্ত।পোস্ট টি যদি ভালো লেগে থাকে তো অবশ্যই পোস্ট এ একটা লাইক দিবেন।আপনার মতামত জানানোর জন্য কমেন্ট বক্স উন্মুক্ত রয়েছে।এবং আমাদের সাইটে (প্রযুক্তি.কম প্রতিদিন ভিজিট করুন।সঙ্গে থাকুন।ধন্যবাদ।আবার দেখা হবে পার্ট -৩ এ।
আসসালামুয়ালাইকুম।

Read More


Post Date: April 4, 2020 Total: 178 Views

Leave a Reply on Tipsjano.Com

Copyright © 2018 All rights reserved.