• আমাদের সম্পর্কে
  • গোপনীয় নীতি
  • বিজ্ঞাপন
  • যোগাযোগ করুন
  • শর্তাবলী
  • জাগোরিকে লিখুন
শুক্রবার, ডিসেম্বর ৮, ২০২৩
  • Login
Jagorik
  • এসএসসি
  • এইচএসসি
  • অনার্স
  • মাস্টার্স
  • স্কিল
    • এসইও
    • ওয়েব ডিজাইন
    • কোডিং শিখুন
    • গেস্ট ব্লগিং
    • অনলাইনে ইনকাম
    • ফ্রিল্যান্সিং শিখুন
  • বিদেশে পড়াশোনা
    • স্কলারশিপ
    • আমেরিকা
    • ফিনল্যান্ড উচ্চ শিক্ষা
    • ভারত
  • স্বাস্থ্যবার্তা
    • ঔষধের নাম
    • স্বাস্থ্য
    • ত্বকের যত্ন
    • নারী স্বাস্থ্য
    • বিউটি টিপস
    • মা ও শিশু
  • আইন
  • বিসিএস পরীক্ষা
  • চাকরি
  • জাগোরিক স্পেশাল
  • অন্যান্য
    • আবেদন পত্র
    • উপবৃত্তি
    • ইতিহাস ও ঐতিহ্য
    • জানা-অজানা
    • ডিপ্লোমা ইঞ্জিনিয়ারিং
    • তথ্য প্রযুক্তি
    • ষষ্ঠ শ্রেণি
      • ষষ্ঠ শ্রেণির ইসলাম ও নৈতিক শিক্ষা
      • ষষ্ঠ শ্রেণির বাংলা
      • ষষ্ঠ শ্রেণির স্বাস্থ্য সুরক্ষা
    • সকল শ্রেণির বই
    • সপ্তম শ্রেণি: ইংরেজি
    • সাধারণ জ্ঞান
    • অষ্টম শ্রেণি
      • অষ্টম শ্রেণি বাংলা
      • অষ্টম শ্রেণি: ইংরেজি ১ম
    • ইংরেজি শিখুন
    • লতা-পাতা
    • প্রথম শ্রেণি
      • প্রথম শ্রেণি ইংরেজি’
      • প্রথম শ্রেণি গণিত
      • প্রথম শ্রেণির বাংলা
No Result
View All Result
  • এসএসসি
  • এইচএসসি
  • অনার্স
  • মাস্টার্স
  • স্কিল
    • এসইও
    • ওয়েব ডিজাইন
    • কোডিং শিখুন
    • গেস্ট ব্লগিং
    • অনলাইনে ইনকাম
    • ফ্রিল্যান্সিং শিখুন
  • বিদেশে পড়াশোনা
    • স্কলারশিপ
    • আমেরিকা
    • ফিনল্যান্ড উচ্চ শিক্ষা
    • ভারত
  • স্বাস্থ্যবার্তা
    • ঔষধের নাম
    • স্বাস্থ্য
    • ত্বকের যত্ন
    • নারী স্বাস্থ্য
    • বিউটি টিপস
    • মা ও শিশু
  • আইন
  • বিসিএস পরীক্ষা
  • চাকরি
  • জাগোরিক স্পেশাল
  • অন্যান্য
    • আবেদন পত্র
    • উপবৃত্তি
    • ইতিহাস ও ঐতিহ্য
    • জানা-অজানা
    • ডিপ্লোমা ইঞ্জিনিয়ারিং
    • তথ্য প্রযুক্তি
    • ষষ্ঠ শ্রেণি
      • ষষ্ঠ শ্রেণির ইসলাম ও নৈতিক শিক্ষা
      • ষষ্ঠ শ্রেণির বাংলা
      • ষষ্ঠ শ্রেণির স্বাস্থ্য সুরক্ষা
    • সকল শ্রেণির বই
    • সপ্তম শ্রেণি: ইংরেজি
    • সাধারণ জ্ঞান
    • অষ্টম শ্রেণি
      • অষ্টম শ্রেণি বাংলা
      • অষ্টম শ্রেণি: ইংরেজি ১ম
    • ইংরেজি শিখুন
    • লতা-পাতা
    • প্রথম শ্রেণি
      • প্রথম শ্রেণি ইংরেজি’
      • প্রথম শ্রেণি গণিত
      • প্রথম শ্রেণির বাংলা
No Result
View All Result
Jagorik
No Result
View All Result

এইচটিএমএল কালার কোড ও ফ্রেম (Color & Frame: Part-7)

জাগোরিক by জাগোরিক
in এইচটিএমএল টিউটোরিয়াল, ওয়েব ডিজাইন
Reading Time: 10 mins read
A A
0
ফেসবুকে শেয়ার করুনটুইটারে টুইট করুনপিন্টারেস্টে পিন করুনলিংকডিনে শেয়ার করুন

একজন দক্ষ ফ্রিল্যান্সার গড়ার লক্ষে দেশে এই প্রথম জাগোরিক নিয়ে এসেছে বাংলা এইচটিএমএল টিউটোরিয়াল আর্টিকেল যার এই পর্বে থাকছে এইচটিএমএল কালার কোড ও ফ্রেম সম্পর্কে বিস্তারিত।

এটি হচ্ছে বাংলা এইচটিএমএল টিউটোরিয়াল Part-7 এরই ধারাবাহিকতায় আমরা HTML এর সম্পূর্ণ সিরিজ শেষ করার চেষ্টা করব। সকল পর্বের টিউটোরিয়াল এখানে ক্লিক করলে পেয়ে যাবেনঃ এইচটিএমএল টিউটোরিয়াল

এইচটিএমএল কালার কোড ও ফ্রেম (Color & Frame: Part-7)

HTML COLOR CODE:

এইচটিএমএল এ যেকোন এলিমেন্ট এর রং সেট করার তিনটি পদ্ধতি আছে। ১. রংয়ের নাম দিয়ে, ২. রংয়ের RGB মান দিয়ে এবং ৩. রংয়ের হেক্সাডেসিমাল মান দিয়ে

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

আপনি সরাসরি রংয়ের নাম ব্যবহার করে একটা এইচটিএমএল এলিমেন্টে রং দিতে পারেন। সাধারন কিছু কালার যেমন black, white, red ইত্যাদি। এইচটিএমএল এ কালার value লেখার সময় সরাসরি এদের নাম লেখা হয়। নিচে ১৬টি মৌলিক কালারের নাম লেখা হল।

Black Gray Silver White
Yellow Lime Aqua Fuchsia
Red Green Blue Purple
Maroon Olive Navy Teal

উদাহরন

01.<html>
02.<head>
03.<title>HTML Color Tutorial | Jagorik</title>
04.</head>
05.<body bgcolor="red">
06.<p style="background:black;">Bangladesh is a country of natural beauty</p>
07.<p class="Jagorik">Jagorik DOT com is the largest bengali tutorial site</p>
08.</body>
09.</html>

 

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

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

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

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

bgcolor=”rgb(255,255,255)” White
bgcolor=”rgb(255,0,0)” Red
bgcolor=”rgb(0,255,0)” Green
bgcolor=”rgb(0,0,255)” Blue

 


  • আরও পড়ুনঃ বাংলা এইচটিএমএল টিউটোরিয়াল (Introduction: Part-1)
  • আরও পড়ুনঃ এইচটিএমএল ট্যাগ ও এট্রিবিউট (Tag & Attribute: Part-2)
  • আরও পড়ুনঃ এইচটিএমএল প্যারাগ্রাফ ও হেডিং (P tag & Heading: Part-3)
  • আরও পড়ুনঃ এইচটিএমএল লিস্ট ও ফন্ট (HTML List & Font: Part-4)
  • আরও পড়ুনঃ এইচটিএমএল লিংক ও এনটাইটিজ (Link & Entities: Part-5)

এইচটিএমএল ব্যাকগ্রাউন্ড

এইচটিএমএল ফ্রেম দিয়ে একটা ওয়েব পেজকে দুই বা ততোধিক ভাগে ভাগ করা যায়। ডিভের ব্যাপারটা চিন্তা করুন, প্রতিটি ডিভে যেমন আলাদা আলাদা কনটেন্ট দেয়া যায় তেমনি  প্রত্যেকটি ফ্রেমে আলাদা আলাদা পেজ লোড করানো যায়।

ধরুন আপনার একটি পেজে ৩টি ফ্রেম আছে, আপনি চাইলে যেকোন একটিকে রিলোড করাতে পারেন (পুরো পেজ লোড করানো ছাড়াই)। একটা পেজে কয়েকটি ফ্রেম থাকলে সেটাকে বলে ফ্রেমসেট। <frameset></frameset> এর ভিতরে <frame></frame> রাখতে হয়।

যেমন নিচের উদাহরনের কোডটুকু frame_example.html নামে সেভ করুন এবং ৯, ১০ ও ১১ নং লাইনে দেখুন প্রতিটি এক একটি ফ্রেম।

প্রথম ফ্রেমে top.html নামে আরেকটি পূর্নাঙ্গ এইচটিএমএল পেজ তৈরী করে ঢুকিয়ে দিয়েছি।

এভাবে পরের দুটিতেও middle.html এবং bottom.html নামে দুটি পেজ দিয়েছি। এখন যখনি frame_example.html খুলবেন তখন এই পেজটির ভিতর top.html, middle.html এবং bottom.html এর কনটেন্ট দেখাবে।

অর্থ্যাৎ একটা পেজের ভিতর ৩টি পেজ দেখাবে।

01.<?xml version="1.0" encoding="iso-8859-1"?>
02.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
03."http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
04.<html>
05.<head>
06.<title> Jagorik Frame Tutorial </title>
07.</head>
08.<frameset rows="200,100,*">
09.<frame src="/top.html"/>
10.<frame src="/middle.html"/>
11.<frame src="/bottom.html"/>
12.<noframes>
13.<body>
14.This site uses a technology called frames. Unfortunately, your
15.browser does not support this technology. Please upgrade
16.your browser and visit us again!
17.</body>
18.</noframes>
19.</frameset>
20.</html>

প্রদর্শন:

==> <noframes></noframes>  দেয়া হয়েছে যদি আপনার ব্রাউজার ফ্রেম সাপোর্ট না করে তাহলে এর ভিতরের মেসেজটি দেখাবে।

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

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

এইচটিএমএল কালার কোড ও ফ্রেম –

HTML 5 এ ফ্রেম সাপোর্ট করেনা তাই ফ্রেম নিয়ে বেশি আলোচনা করবনা। ধীরে ধীরে এর ব্যবহার উঠে যাচ্ছে।

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

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

iframe বা inline frame দিয়ে এইচটিএমএল ডকুমেন্টে সম্পূর্ন ভিন্ন একটি অংশ ঢুকিয়ে দেয়া যায় যেখানে ভিন্ন কোন ওয়েব পেজ প্রদর্শিত হবে।

01.<!DOCTYPE html>
02.<html>
03.<head>
04.<title> Jagorik Frame Tutorial </title>
05.</head>
06.<body>
07.<iframe width="100%" src="http://www.Jagorik.com">
08.Your browser does not support iframe tag
09.</iframe>
10.</body>
11.</html>

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

name : iframe এর নাম দেয়া যায়। যেমন

1.<iframe name="wchbd" width="100%" src="http://www.Jagorik.com">
2.Your browser does not support iframe tag
3.</iframe>

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

1.<iframe name="wchbd" width="100%" src="http://www.Jagorik.com" seamless="seamless">
2.Your browser does not support iframe tag
3.</iframe>

srcdoc=”html content” এই এট্রিবিউটের মান এইচটিএমল এলিমেন্ট দিতে পারেন ফলে সেটা iframe এর ভিতর দেখাবে।

 

এইচটিএমএল কালার কোড ও ফ্রেম –

উক্ত বিষয় সম্পর্কে কিছু জানার থাকলে কমেন্ট করতে পারেন।
আমাদের সাথে ইউটিউব চ্যানেলে যুক্ত হতে এখানে ক্লিক করুন এবং আমাদের সাথে ফেইজবুক পেইজে যুক্ত হতে এখানে ক্লিক করুন।
গুরুত্বপূর্ণ আপডেট ও তথ্য পেতে আমাদের ওয়েবসাইটে ভিজিট করুন।

এই বিভাগের আরো লেখা

এইচটিএমএল সুপারস্ক্রিপ্ট সাবস্ক্রিপ্ট ও ফর্ম
এইচটিএমএল টিউটোরিয়াল

এইচটিএমএল সুপারস্ক্রিপ্ট সাবস্ক্রিপ্ট ও ফর্ম (Part-12)

অক্টোবর ২২, ২০২২
এইচটিএমএল টেক্সক্ট ফিল্ড আপলোড ও ড্রপডাউন
এইচটিএমএল টিউটোরিয়াল

এইচটিএমএল টেক্সক্ট ফিল্ড আপলোড ও ড্রপডাউন (Part-13)

অক্টোবর ২২, ২০২২
এইচটিএমএল বোল্ড ও ইটালিক কোড এবং pre ট্যাগ
এইচটিএমএল টিউটোরিয়াল

এইচটিএমএল বোল্ড ও ইটালিক কোড এবং pre ট্যাগ (Part-11)

অক্টোবর ২১, ২০২২
এইচটিএমএল লেআউট ও কমেন্ট
এইচটিএমএল টিউটোরিয়াল

এইচটিএমএল লেআউট ও কমেন্ট (Layout&Comment:Prt-8)

অক্টোবর ২১, ২০২২
এইচটিএমএল বডি ও ডিভ
এইচটিএমএল টিউটোরিয়াল

এইচটিএমএল বডি ও ডিভ (HTML Body & Div: Part-10)

অক্টোবর ২১, ২০২২
এইচটিএমএল মিউজিক ও ভিডিও
এইচটিএমএল টিউটোরিয়াল

এইচটিএমএল মিউজিক ও ভিডিও (Music & Video: Part-9)

অক্টোবর ২০, ২০২২
Next Post
এইচটিএমএল বডি ও ডিভ

এইচটিএমএল বডি ও ডিভ (HTML Body & Div: Part-10)

এইচটিএমএল লেআউট ও কমেন্ট

এইচটিএমএল লেআউট ও কমেন্ট (Layout&Comment:Prt-8)

এইচটিএমএল বোল্ড ও ইটালিক কোড এবং pre ট্যাগ

এইচটিএমএল বোল্ড ও ইটালিক কোড এবং pre ট্যাগ (Part-11)

Leave a Reply Cancel reply

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

জনপ্রিয় লেখাগুলো

No Content Available

অন্যান্য বিভাগ থেকে

HSC হিসাববিজ্ঞান ২য় পত্র সকল কলেজের বহুনির্বাচনি ২৮ PDF

HSC | হিসাববিজ্ঞান ২য় পত্র | সকল কলেজের বহুনির্বাচনি ২৮ | PDF

সেপ্টেম্বর ১৮, ২০২৩
HSC হিসাববিজ্ঞান ২য় পত্র সকল কলেজের বহুনির্বাচনি ৬৫ PDF

HSC | হিসাববিজ্ঞান ২য় পত্র | সকল কলেজের বহুনির্বাচনি ৬৫ | PDF

সেপ্টেম্বর ২০, ২০২৩
ইংরেজি শেখার অসাধারণ কিছু টিপস

ইংরেজি শেখার অসাধারণ কিছু টিপস এবং এপ্লিকেশন

অক্টোবর ১৬, ২০২২
PDF রাজনৈতিক তত্ত্ব পরিচিতি রুশো রচনামূলক প্রশ্নোত্তর

PDF রাজনৈতিক তত্ত্ব পরিচিতি: রুশো রচনামূলক প্রশ্নোত্তর

ডিসেম্বর ১৮, ২০২২
  • আমাদের সম্পর্কে
  • গোপনীয় নীতি
  • জাগোরিকে লিখুন
  • বিজ্ঞাপন
  • যোগাযোগ করুন
  • শর্তাবলী
Call us: +1 234 JEG THEME

© ২০২৩ জাগোরিক - সর্বস্বত্ব স্বত্বাধিকার সংরক্ষিত

No Result
View All Result
  • এসএসসি
  • এইচএসসি
  • অনার্স
  • মাস্টার্স
  • স্কিল
    • এসইও
    • ওয়েব ডিজাইন
    • কোডিং শিখুন
    • গেস্ট ব্লগিং
    • অনলাইনে ইনকাম
    • ফ্রিল্যান্সিং শিখুন
  • বিদেশে পড়াশোনা
    • স্কলারশিপ
    • আমেরিকা
    • ফিনল্যান্ড উচ্চ শিক্ষা
    • ভারত
  • স্বাস্থ্যবার্তা
    • ঔষধের নাম
    • স্বাস্থ্য
    • ত্বকের যত্ন
    • নারী স্বাস্থ্য
    • বিউটি টিপস
    • মা ও শিশু
  • আইন
  • বিসিএস পরীক্ষা
  • চাকরি
  • জাগোরিক স্পেশাল
  • অন্যান্য
    • আবেদন পত্র
    • উপবৃত্তি
    • ইতিহাস ও ঐতিহ্য
    • জানা-অজানা
    • ডিপ্লোমা ইঞ্জিনিয়ারিং
    • তথ্য প্রযুক্তি
    • ষষ্ঠ শ্রেণি
      • ষষ্ঠ শ্রেণির ইসলাম ও নৈতিক শিক্ষা
      • ষষ্ঠ শ্রেণির বাংলা
      • ষষ্ঠ শ্রেণির স্বাস্থ্য সুরক্ষা
    • সকল শ্রেণির বই
    • সপ্তম শ্রেণি: ইংরেজি
    • সাধারণ জ্ঞান
    • অষ্টম শ্রেণি
      • অষ্টম শ্রেণি বাংলা
      • অষ্টম শ্রেণি: ইংরেজি ১ম
    • ইংরেজি শিখুন
    • লতা-পাতা
    • প্রথম শ্রেণি
      • প্রথম শ্রেণি ইংরেজি’
      • প্রথম শ্রেণি গণিত
      • প্রথম শ্রেণির বাংলা

© ২০২৩ জাগোরিক - সর্বস্বত্ব স্বত্বাধিকার সংরক্ষিত

Welcome Back!

Login to your account below

Forgotten Password?

Retrieve your password

Please enter your username or email address to reset your password.

Log In