লেখক:আর শর্টকার্ট নয় সঠিক নিয়মে সবাই মিলে শিখি ওয়েব ডিজাইন ও ওয়েব প্রোগ্রামিং (HTML-1) এর মাধ্যমে আমরা HTML সম্পর্কে প্রাথমিক ধারণা অর্জন করেছি। এখন আমরা HTML ব্যবহার করে কিভাবে একটা ওয়েব পেজের ব্যকগ্রাউন্ড কালার দিতে হয় সেই বিষয়টি দেখব।
আমাদের প্রয়োজনীয় Code এবং এর বিভিন্ন অংশ:
আমরা একটা নোটপ্যাড open করে নিচের code টুকু লিখি।
Code:
<html>
<head>
<title> This is the title of your web site.</title>
</head>
<body bgcolor=”green”>
This is the body of your web site.
</body>
</html>
এখন file মেনু থেকে Save as এ ক্লিক করে File name: index.html , Save as type : All files, দিয়ে save করি । save করা index.html ফাইলটি Internet explorer দিয়ে open করলে নিচের মত দেখাবে।
C0de বিশ্লেষণ:
<html> ,<head>,<title>,<body> ট্যাগ গুলির সাথে আমরা এখন পরিচিত। আমরা যদি একটি ওয়েব পেজে HTML ব্যবহার করে ব্যকগ্রাউন্ড কালার দিতে চাই তাহলে আমাদেরকে <body> ট্যাগের মধ্যে body লেখার পর একটা স্পেস দিয়ে bgcolor=” “ লেখতে হবে এখন আমরা “ ” এর মধ্যে BLACK, SILVER, GRAY, WHITE, MAROON, RED, PURPLE, FUSCHSIA, GREEN, LIME, OLIVE, YELLOW, NAVY, BLUE, TEAL এবং AQUA এই ষেলটি রং এর যে কোন একটি লিখলে আমরা আমাদের তৈরিকৃত পেজের ব্যকগ্রাউন্ডে সেই কালারটি দেখতে পাব। যেহেতু case sensitive নয় তাই ছোট হতের অক্ষরে লিখলেও হবে, যেমন আমি লিখেছি
<body bgcolor=”green“> ।
এছাড়া আমরা hexadecimal code ব্যবহার করেও ব্যাকগ্রাউন্ড কালার নির্বাচন করে দিতে পারি, যেমন আমরা উপরের কোডটি নিচের মত লেখতে পারি
<body bgcolor=”#00FF00“> ।
আমরা PHOTOSHOP এর color piker থেকে সহজেই আমরা বিভিন্ন কালারের জন্য hexadecimal code সংগ্রহ করতে পারি। এছাড়া নিচের চার্ট থেকেও আমরা এ কাজটি করতে পারি। যা হোক আমাদেরকে hexadecimal code এর শুরুতে একটা # চিহ্ন দিয়ে শুরু করতে হবে।
এখানেই শেষ নয় ব্যকগ্রাউন্ড কালার দেওয়ার আরও একটা মজার পদ্ধতি আছে। আমরা জানি লাল, সবুজ আর নীল এই তিনটি রং হল মৌলিক রং আর অন্য সব রং হচ্ছে এই তিনটি রং এর সংমিশ্রনে তৈরি। তাই আমরা যদি coding করে এই তিনটি রংকে মিশিয়ে নতুন রং তৈরি করতে পারি ও ব্যবহার করতে পারি তবে তা মন্দ হয় না। তাহলে আমরা সবুজ ব্যকগ্রাউন্ডের জন্য নিচের মত করে লিখতে পারি
<body bgcolor=”rgb(0,255,0)“> ।
এখানে rgb অর্থ হল red green blue আর (0,255,0) এর অর্থ হল রংটিতে যথাক্রমে লাল, সবুজ, নীল রং এর পরিমান যথাক্রমে 0%, 100%, 0% কারন আমরা বিশুদ্ধ সবুজ রং নিয়েছি। আর যে কোন রং এর মান 0-255 পর্যন্ত হতে পারে। যেহেতু g বা green এর মান 255 তাই তা 100%। তিনটি রং এর মান 0-255 এর মধ্যে পরিবর্তন করে আমরা আমাদের ইচ্ছা অনুযায়ী নতুন নতুন রং তৈরি করতে পারি ।
শেষে দুটি কথা: ছোট একটা ব্যপার লিখতে গিয়ে অনেক বড় করে ফেললাম । অমিও বুঝতে পারিনি যে এত বড় হবে । লেখতে লেখতে অনেক কিছু মাথায় চলে এল তাই শেয়ার করলাম। এক ঘেয়েমি লাগলে ক্ষমা করবেন । কিন্তু যা লেখলাম ভবিষ্যতে coding করতে গিয়ে আমাকেও বারবার এই লেখাটিতে ফিরে দেখতে হবে। আর আমাদের শুধুমাত্র ব্যকগ্রাউন্ডের জন্য নয় Text formating এর জন্যও রং এর code নির্বাচন খুবই গুরুত্বপূর্ণ। তো রঙে রঙে রাঙিয়ে তুলুন আপনার ওয়েব পেজ। সবাই ভাল থাকবেন।
আরএসএস ফিড সাবক্রাইব
ভাই আপনার পোষ্টটি ভাল হয়েচ্ছে আরো চাই
[...] অসিমের HTML টিউটরিয়াল প্রথম পর্ব এবং দ্বিতীয় পর্ব) এ চোঁখ রাখুন। এখানে যে ফরমটি দেখতে [...]
ভাই এইচটিএমএল জানি মোটামোটি তবে আজ আরো কিছু এ্যাড হল সংগে।
আরো লিখেন ভাই।
সকলকে ধন্যবাদ,
শিঘ্রই HTML-3 ও দেখতে পাবেন।
[...] HTML তারিখ: 01 17th, 2010 | কেউ মন্তব্য করে নি| আর শর্টকার্ট নয় সঠিক নিয়মে সবাই মিলে শ… এর মাধ্যমে আমরা কিভারে HTML এর মাধ্যমে [...]
ভাইয়া, খুবই ভােলা েলেগেছ ।
(সজীব এবং সাগর)
@সজীব এবং সাগর: ধন্যবাদ আপনাদেরকে। আশা করি পরবর্তি পর্বে নিয়মিত থাকবেন। আপনাদের প্রেরণাতেই নতুন নতুন লেখার জন্ম হয়।
[...] আমার প্রথম ওয়েব সাইট (প্রাথমিক ধারণা) HTMLপর্ব- দুই: রঙের ব্যবহার HTMLপর্ব- তিন: ব্যাকগ্রাউন্ড এ রঙের [...]
[...] HTMLপর্ব- দুই: রঙের ব্যবহার [...]
[...] আমার প্রথম ওয়েব সাইট (প্রাথমিক ধারণা) HTMLপর্ব- দুই: রঙের ব্যবহার HTMLপর্ব- তিন: ব্যাকগ্রাউন্ড এ রঙের [...]
[...] আমার প্রথম ওয়েব সাইট (প্রাথমিক ধারণা) HTMLপর্ব- দুই: রঙের ব্যবহার HTMLপর্ব- তিন: ব্যাকগ্রাউন্ড এ রঙের [...]
[...] আবষ্যক । এ ব্যপারে আমার HTMLপর্ব- এক HTMLপর্ব- দুই HTMLপর্ব- তিন HTMLপর্ব- চার [...]
[...] থাকা আবষ্যক । এ ব্যপারে আমার HTMLপর্ব- এক HTMLপর্ব- দুই HTMLপর্ব- তিন HTMLপর্ব- চার HTMLপর্ব-পাঁচ HTML [...]
[...] বাংলা ভাষার ওয়েবসাইট বানানোর পদ্ধতিআর শর্টকার্ট নয় সঠিক নিয়মে সবাই মিলে শ…একসাথে ২২টি অডিও ভিডিও টুলস (ফ্রি [...]
আপনাকে অনেক ধন্যবাদ এ রকম একটি কাজের পোস্ট দেয়ার জন্য।
@Hossain,( আপনাকে চেনা মনেহচ্ছে। ) আসলে টিউটরিয়ালবিডির এ টিউটরিয়ালগুচ্ছ পেয়ে আমি আন্দিত।