Web Design And Development Course-HTML Color code

Web Design And Development Course

Web Design And Development Course

বিস্তারিত:

HTML এ যেকোন Element এর (color) রং সেট করার তিনটি পদ্ধতি আছে। ১. Color এর রংয়ের নাম দিয়ে, . Color এর রংয়ের RGB মান দিয়ে এবং . Color এর রংয়ের হেক্সাডেসিমাল মান দিয়ে

 

. রংয়ের নাম দিয়ে:

আপনি সরাসরি (Color) রংয়ের নাম ব্যবহার করে একটা HTML Element color (রং) দিতে পারেন। সাধারন কিছু কালার যেমন Black (ব্লাক), White (হোয়াইট), Red (রেড) ইত্যাদি। HTML এ Color (কালার) Value লেখার সময় সরাসরি এদের নাম লেখা হয়। নিচে ১৬টি মৌলিক কালারের নাম দেয়া হল,,

Web Design And Development Course

উদাহরন:

 

Web Design And Development Course

. RGB মান মান দিয়ে:

আমি আপনাদেরকে নিরাপদ Web Design এর জন্য HTML Rgb ব্যবহারের পরামর্শ দেব না কারন Non-IE browser,  HTML Rgb সাপোর্ট করে না। আপনারা যদি CSS শিখতে চান তাহলে আপনাদের উচিত এই বিষয় সম্বন্ধে বিশদ জানা।

Red, Green এবং Blue এই তিনটি কালারের সমষ্টি হচ্ছে  Rgb । প্রত্যেকের মান ০(যখন কোন কালার থাকে না) হতে ২৫৫(যখন ঐ কালারটি সম্পুর্ন থাকে)। Rgb ফরমেটটি হল Rgb(RED,GREEN,BLUE)।

Red, Green এবং Blue এর মান:

 

Web Design And Development Course

Web Design And Development Course-HTML

Background.

 

Web Design And Development Course

Web Design And Development Course

বিস্তারিত:

Background Attributes এর সাহায্যে HTML  টেবিলে Image (ইমেজ)কে Background Image হিসাবে দেখানো যায়।

Web Design And Development Course

প্রদর্শন:

Web Design Course

HTML Background  (এইচটিএমএল ব্যাকগ্রাউন্ড) রিপিট:

আমরা উপরের উদাহরনে দেখতে পাচ্ছি  যে টেবিল এর আকার ছবির আকারের সমান বলে কোন সমস্যা হয় নি । যদি আমাদের টেবিল এর আকার ছবির আকারের চেয়ে বড় হয় তবে Background ছবি রিপিট হবে।

Web Design, Development Course

প্রদর্শন:

Web Design And Development Course

HTML(এইচটিএমএল) প্যাটার্নড Background (ব্যাকগ্রাউন্ড):

বিভিন্ন Photo Editing(ফটো এডিটিং)Software(সফ্টওয়ার) দিয়ে বিভিন্ন প্যাটার্নের Background(ব্যাকগ্রাউন্ড) ছবি এরং Transparent (ট্রান্সপারেন্ট) Background ছবি তৈরী করা যায়।Transparent (ট্রান্সপারেন্ট) ইমেজের ফাইলটিকে GIF ফরমেটে রাখতে হবে jpeg ফরমেটে নয়।

Web Design Course

প্রদর্শন:

Web Design And Development

প্রদর্শন:

Web Design And Development Course

Web Design And Development Course

Web Design And Development Course

বিস্তারিত:

HTML Frame দিয়ে একটা Web পেজকে দুই বা ততোধিক ভাগে ভাগ করা যায়। ডিভের ব্যাপারটা চিন্তা করুন, প্রতিটি ডিভে যেমন, আলাদা আলাদা Content (কনটেন্ট) দেয়া যায় তেমনি  প্রত্যেকটি ফ্রেমে আলাদা আলাদা Page পেজ) লোড করানো যায়।

HTML Background Tutorial Part-16 দেখুন…

ধরা যাক আপনার একটি পেজে যে কোন ৩টি ফ্রেম আছে, আপনি চাইলে এর যেকোন একটিকে রিলোড করাতে পারেন । এ্ পেজে কয়েকটি ফ্রেম থাকে বা থাকলে সেটাকে বলে Frame-set (ফ্রেমসেট)। <frame-set></frame-set> এর ভিতরে <frame></frame> রাখতে হয়। যেমন নিচের উদাহরনের Code টুকু frame_example.html নামে সেভ করুন এবং ৯, ১০ ও ১১ নং লাইনে দেখুন প্রতিটি এক একটি  ধরনের ফ্রেম। প্রথম ফ্রেমে top.html নামে আরেকটি পূর্নাঙ্গ HTML (এইচটিএমএল) পেজ তৈরী করে ঢুকিয়ে দিয়েছি। এভাবে পরের দুটিতেও middle.html এবং bottom.html নামে দুটি পেজ দিয়েছি। এখন যখনি আপনি frame_example.html খুলবেন তখন এই পেজটির ভিতর top.html, middle.html এবং bottom.html এর কনটেন্ট দেখাবে। অর্থ্যাৎ একটা পেজের ভিতর ৩টি পেজ দেখাবে।

Web Design And Development Course

প্রদর্শন:

 

Web Design And Development ==> <no-frames></no-frames>  দেয়া হয়েছে যদি আপনার Browser এ ফ্রেম সাপোর্ট না করে তাহলে এর ভিতরের Massage (মেসেজ)টি দেখাবে।

==> <frame src=”/top.html”/> এখানে src তে পেজের লিংক ঠিক এবং সঠিকভাবে দিতে হবে।

==> < frame-set rows=”200,100, * > এটা দিয়ে বোঝানো হয়েছে যে প্রথম ফ্রেমটি (top.html) টি ২০০ পিক্সেল উচু হবে পরেরটি ১০০ এবং শেষেরটিতে বাকি অংশ নিয়ে নেবে (* চিহ্ন)।

 

** উদাহরন হতে  দেখুন X HTML DOC type ব্যবহার করেছি HTML 5 এর পরিবর্তে।

** HTML 5 এ ফ্রেম সরিয়ে ফেলার কারনে এই সমস্ত কাজের জন্য I frame নামে একটা ট্যাগ ব্যবহার করা হয়।

I frame বা Inline Frame দিয়ে HTML Document  সম্পূর্ন ভিন্ন ভিন্ন  একটি অংশ ঢুকিয়ে দেয়া হলে যেখানে ভিন্ন ভিন্ন কোন Web  পেজ প্রদর্শিত হবে।

Web Design And Development Course

প্রয়োগ দেখুন:

Src  Attributes যে কোন ধরনের লোকাল ফাইলও দিতে পারেন, আমিও একটা URL দিয়েছি। এছাড়া আরো অনেক Attributes ব্যবহার করা যায় তবে তার বেশিরভাগই HTML 5 এ সাপোর্টেড নয়। HTML 5 এ উপরে ব্যবহৃত দুটি (src এবং width) সাপোর্ট করে সাথে সাথে নিচেরগুলি name : i frame এর নাম দেয়া যায়। যেমন,,

Web Design And Development Course

seamless=”seamless” দিলে frame এমন দেখাবে যেন এটা এই পেজেরই অংশ

Web Design And Development Course

srcdoc=”html content” এই Attributes এর মান HTML Element  দিতে পারেন ফলে সেটা I frame এর ভিতর দেখাবে।

ওয়েব সাইট ডিজাইনে দক্ষ হতে চাইলে আমাদের  টিউটোরিয়াল দেখার পাশাপাশি গুগলে অনিক Web Design And Development Course আছে যেগুলো আপনাদের দেখা উচিত।

 See More Article…

Note: পরবর্তী Web Design And Development Course টিউটোরিয়ালে (Part-18) এইচটিএমএল লেআউট টিউটোরিয়াল এর  বিস্তারিত আলোচনা করা হবে।

See More Articles…

Web Design And Development Course- HTML Layout Tutorial

Web Design And Development -HTML Comments Tutorial

Web Design And Development Course-HTML Embed Music Tutorial

Web Design And Development -HTML Video Tutorial

 

 

3 thoughts on “Web Design And Development Course-HTML Color code”

  1. Pingback: Web Design And Development Course-HTML Tables Tutorial in Bangla -

  2. Pingback: Web Design And Development Course-HTML Images Tutorial in Bangla. -

  3. Pingback: Web Design And Development Course-HTML Entities Tutorial in Bangla -

Leave a Comment

Your email address will not be published. Required fields are marked *

Recommended
Web Design And Development Course বিস্তারিত: HTML Layout হল খুব…
Cresta Posts Box by CP