HSC ICT Chaper 4 Part-4
Introduction to Web Design and HTML
In this HSC ICT Chapter 4 Part-4 : Introduction to Web Design And Html we will learn about What is Hyperlink ? example of page using differnt tag ,What is HTML Font Tag ? Use of style tag .
৪১. হাইপারলিংক(What is Hyperlink ) কী?
উঃ কোনাে ওয়েব পেজ এর ভিতরে লেখা, ছবি, অডিও, ভিডিও, ডকুমেন্ট অন্য ওয়েব পেজ বা ওয়েব সাইটের সাথে সংযােগ স্থাপন করাকে হাইপারলিংক বলে।
৪২. হাইপারলিংক কত প্রকার ও কী কী?
উঃ হাইপারলিংক ২ প্রকার যথাঃ
ক) ইন্টারনাল।
খ) এক্সটারনাল।
৪৩. হাইপারলিংকের সুবিধা লেখ?
উঃ হাইপারলিংকের( Hyperlink ) সুবিধা সমূহ নিচে দেওয়া হলাে• অতিদ্রুত যেকোনাে ওয়েবসাইট বা ওয়েব পেজ দেখা যায়।
- ভিজিটের সময় বাচে ।
- দ্রুত এক পেজ বা ডকুমেন্ট হতে অন্য পেজ বা ডকুমেন্টে যাওয়া যায় ।
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<a href="https://www.tutorialforbeginner.com/" target="_blank">This is a link</a>
</body>
</html>Output:
৪৪. ওয়েবসাইট পাবলিশ কি এবং এর ধাপ সমূহ লেখ?
উঃ ওয়েবসাইট তৈরি করা একটি সৃষ্টিশীল কাজ। প্রােগ্রামার কতুক ওয়েবসাইট তৈরির পর ভিজিটরদের কাছে সুন্দর,
আকর্ষনীয়, অর্থবহ ও সহজে দেখার ব্যবস্থা করার জন্য এটাকে সাভারে হােস্ট করতে হয় তাকে ওয়েবসাইট পাবলিশিং বলে।
ধাপ সমূহ নিচে দেওয়া হলােঃ
ক) ওয়েবসাইট তৈরি করা ।
খ) ডোমেইন নাম কেনা ।
গ) হোস্টিং করা ও ডকুমেন্ট আপলোড করা ।
ঘ) SEO করা ।
45. বিভিন্ন ট্যাগ(example of a page) ব্যবহার করে একটি পেজ তৈরি কর ?
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p>ICT Coaching Center </p>
<p>This is a Paragraph Tag</p>
<p><small>This is a Small Tag</small></p>
<p><<big>This is a Big Tag</big></p>
<p><b>This is a Bold Tag</b></p>
<p><strong>This is a Strong Tag</strong></p>
<p><u>This is a Underline Tag</u></p>
<p><i>This is a Italic Tag</i></p>
<p><em>This is a Emphasized Tag</em></p>
<p><del>This is a Deleted Tag</del></p>
<p><This is<sub>Subscript</sub>Tag</p>
<p><This is <sup>SuperScript </sup>Tag</p>
</body>
</html>Output:
ICT Coaching Center
This is a Paragraph Tag
This is a Small Tag
This is a Big Tag
This is a Bold Tag
This is a Strong Tag
This is a Underline Tag
This is a Italic Tag
This is a Emphasized Tag
This is a Deleted Tag
This isSubscriptTag
This isSuperScriptTag
46. এইচটিএমএল ফন্ট (HTML font) ট্যাগ ?
ফন্ট হচ্ছে যেকোনাে ডকুমেন্টের প্রাণ। ফন্ট ব্যবহারের কুশলতায় একটি
ওয়েবপেইজ শুধুমাত্র সুন্দরই হয় না এটা একটি শৈল্পিক পরিচয় বহন করে। আগের ক্লাসে
আমরা আলােচনা করেছি কীভাবে টেক্সট বােল্ড, ইটালিক, আন্ডারলাইন ইত্যাদি করা যায়।
এবার আমরা দেখব কীভাবে ফন্ট পরিবর্তন করা যায়। ধরা যাক, ফন্টের সাইজ, কালার,
অ্যালাইনমেন্ট ইত্যাদি পরিবর্তন করতে হবে। তাহলে ফন্ট ট্যাগ ব্যবহার করতে হবে।
font tag এর তিনটি অ্যাট্রিবিউট রয়েছে। যথা: face, color, size ইত্যাদি। font tag এর সিনটেক্স হলাে :
<font face="fontname" color="fontcolor" size="sizenumber"><font>
এখানে,
১. face: ফন্টের নাম নির্ধারণ করে। যেমন- face= “SutonnyMJ”, face= “Times New Roman br।
২. color: ফন্টের রং নির্ধারণ করে। রং নির্ধারণের জন্য তিনটি পদ্ধতি আছে।
- প্রথমতঃ সাধারণ কিছু কালার যেমন কালাে, সাদা, লাল, সবুজ, নীল ইত্যাদির HTML এ color এর অ্যাট্রিবিউট ভেন্যুতে সরাসরি নাম লিখে প্রকাশ করা যায়। যেমন; color ="red " ।
-
দ্বিতীয়তঃ Red, Green এবং Blue এই তিনটি কালারকে একত্রে rgb লেখ যায়। প্রত্যেকের মান ০ (যখন কোনাে রং থাকে না) হতে ২৫৫ (যখন কোনাে রং পূর্ণমাত্রায় থাকে) পর্যন্ত হতে পারে। rgb পদ্ধতিতে রং নির্ধারণের সিনটেক্সটি হলাে rgb (red, green, blue)।
তবে এই পদ্ধতি ব্যবহার না করাই উত্তম কারণ কোনাে কোনাে ব্রাউজার এই পদ্ধতি সমর্থন করে না।
এই পদ্ধতিতে কিছু রং নির্ণয়ের পদ্ধতি নিচে দেখানাে হলাে
rgb (255,255,255) সাদা rgb (0,0,0) কালাে rgb (255,0,0) লাল rgb (rgb (0.255,0) ) Green rgb (rgb (0.0,255) ) Blue -
তৃতীয়তঃ হেক্সাডেসিমেল নাম্বার সিস্টেমে এর ৬টি ডিজিট ব্যবহার করে রং নির্ধারণ করা হয়। এই পদ্ধতিতে
সিনটেক্সটি হলাে- color="#RRGGBB"
এখানে, RR লাল রং নির্দেশ করে যা 00 থেকে FF হতে পারে, GG সবুজ রং নির্দেশ করে যা 00 থেকে FF হতে পারে, BB নীল রং নির্দেশ করে যা 00 থেকে FF হতে পারে । সুতরাং এই পদ্ধতিতে কালার code হতে পারে “#000000* হতে “#FFFFFF পর্যন্ত। নিচে বিভিন্ন রং এর কোড় দেওয়া হলাে। -
রং R G B Color HEX বেগুনী EE 82 EE #EE82EE ণীল 00 00 FF #0000FF আসমানি 87 CE EB #87CEEB সবুজ 00 FF 00 #00FF00 হ্লুদ FF FF 00 #FFFF00 সাদা FF FF FF #FFFFFF কালো 00 00 00 #000000
আবার ফল্টের সাইজ সরাসরি না লিখে size=rn বা size=-n এভাবেও লেখা যায়। যেখানে n যেকোনাে সংখ্যা। এক্ষেত্রে ফন্টের ডিফল্ট মান ১২। এই মানের হ্রাস-বৃদ্ধি ১ থেকে ৭ হতে পারে। প্রতিমাত্রা যেগে দু’পয়েন্ট করে ফন্টের আকৃতি বৃদ্ধি পাবে অথবা বিয়ােগে ২ পয়েন্ট করে কমে যাবে। এভাবে ফন্টের সাইজ ৮ থেকে ৩৬ পয়েন্ট পর্যন্ত ফন্ট প্রদর্শন করা যাবে। এখানে উল্লেখ্য এক পয়েন্ট হচ্ছে ১ ইঞ্চির ৭২ ভাগের ১ ভাগ। যেমন: size=+1 লিখলে বুঝব ফন্টের আকার হবে ১৪ পয়েন্ট আর size=1 লিখলে বুঝব ফন্টের আকার হবে ১০ পয়েন্ট।
Let see some of example:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p><font face = "verdana">This is a Paragraph Tag</font></p>
<p><font color = "red">This is a Paragraph Tag</font></p>
<p><font color = "FFFF00">This is a Paragraph Tag</font></p>
<p><font font size = "7" >This is a Paragraph Tag</font></p>
</body>
</html>Output:
This is a Paragraph Tag
This is a Paragraph Tag
This is a Paragraph Tag
This is a Paragraph Tag
47.Style Tag -এর সাহায্যে সঠিক উপায়ে ফন্ট নির্ধারণ( Use of style tag ) ?
একটু আগে আমরা font ট্যাগ ব্যবহার করে ফন্টের সাইজ, টাইপ, রং নির্ধারণ করেছি। এবার আমরা style অ্যাট্রিবিউট ব্যবহার করে বিভিন্নভাবে অক্ষর বা প্যারাগ্রাফ ফরম্যাট করব। | Style অ্যাট্রিবিউটের কিছু ভেন্যু আছে সেগুলাে হলাে—
- font-family→ কী ধরনের ফন্ট
- font-size → ফন্টের আকার কত বড় বা ছােট
- font-style → Normal, Italic, oblique, Inherit
- color→রং কী ধরনের
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p style = "font-family:veranda">This is a Paragraph Tag </p>
<p style = "font-family:courier">This is a Paragraph Tag</p>
<p style = " font-size : 80% ;color:red;font-style:Italic">This is a Paragraph Tag</p>
</body>
</html>Output:
This is a Paragraph Tag
This is a Paragraph Tag
This is a Paragraph Tag
Best way of learing
Self learing is the best learing in the world. Discover yourself first then will get what you are And what you want to do .It will push you for self learing.
Why you need to learn coding?
Coding will play a vital role in one's life . It will help to open a new window of thinking . You can think better way than past . It helps to organise all the thing in better way .