
উদ্দীপকটি পড় এবং প্রশ্নের উত্তর দাও:
গ. দৃশ্যকল্পটি ওয়েবপেজে প্রদর্শনের html কোড লিখ।
সমাধানঃ
উদ্দীপকটি পড় এবং প্রশ্নের উত্তর দাও:
গ) উদ্দীপকের দৃশ্যকল্পটি ওয়েবপেজে প্রদর্শনের জন্য HTML কোড লিখ।
সমাধান:
উদ্দীপক অনুসারে প্রশ্নের উত্তর দাওঃ
গ) ছাত্রদের html কোড কেমন হবে তা দেখাও।
ঘ) উদ্দীপকের ফাঁকা ঘরে ছবিটি সংযোজনের ক্ষেত্রে সাবধানতা উল্লেখপূর্বক টেবিলটি তৈরির html কোড লিখ।
সমাধান (গ)
<html> <head> <title> Text Formatting </title> </head> <body> <p> <b>Quick</b> <i>brown</i> <u>fox</u> <br> <strike>Jumps over</strike> the lazy <sup>dog</sup> <br> and <sub>then</sub> <b><i>it fall</i></b> <br> <u><i>prey to a lion.</i></u> </p> </body> </html>
সমাধান (ঘ)
<html> <head> <title> Table </title> </head> <body> <table border="1" cellspacing="0"> <tr align="center"> <td> A </td> <td colspan="2"> B </td> </tr> <tr align="center"> <td> C </td> <td> D </td> <td rowspan="2"> <img src="logo.jpg" width="50" height="50"> </td> </tr> <tr align="center"> <td> E </td> <td> F </td> </tr> </table> </body> </html>
উদ্দীপক অনুসারে প্রশ্নের উত্তর দাওঃ
গ) উদ্দীপক লিস্টটি ওয়েবপেজে যুক্ত করার HTML কোড লিখ।
সমাধানঃ
<!DOCTYPE html> <html> <head> <title> List </title> </head> <body> <h3><u>Compulsory Subject:</u></h3> <ol type="i"> <li>Science</li> <li>B. Studies</li> <li>Humanities</li> <ul type="disc"> <li>Bangla</li> <ol type="1" start="101"> <li>1st Paper</li> <li>2nd Paper</li> </ol> <li>ICT</li> </ul> </ol> </body> </html>
উদ্দীপক অনুসারে প্রশ্নের উত্তর দাওঃ
গ) উদ্দীপক লিস্টটি ওয়েবপেজে যুক্ত করার HTML কোড লিখ।
সমাধানঃ
<!DOCTYPE html> <html> <head> <title> List </title> </head> <body> <ul> <li type="square">About our History</li> <li type="square">Infrastructure</li> <li type="circle">At a glance</li> <li type="circle">Our Mission & vision</li> <li type="disc">Our Achievement</li> <li type="disc">News & Event</li> </ul> </body> </html>
উদ্দীপক অনুসারে প্রশ্নের উত্তর দাওঃ
গ) উদ্দীপক লিস্টটি ওয়েবপেজে যুক্ত করার HTML কোড লিখ।
সমাধানঃ
<!DOCTYPE html> <html> <head> <title> </title> </head> <body> <h2><u>Data Communication</u></h2> <ol type="1"> <li>Transmission Mode</li> <ul type="disc"> <li>Simplex</li> <li>Half-Duplex</li> <li>Full-Duplex</li> </ul> <li>Transmission method</li> <ol type="i"> <li>Serial</li> <ul type="square"> <li>Asynchronous</li> <li>Synchronous</li> <li>Isochronous</li> </ul> <li>Parallel</li> </ol> </ol> </body> </html>
উদ্দীপক অনুসারে প্রশ্নের উত্তর দাওঃ
গ) উদ্দীপক লিস্টটি ওয়েবপেজে যুক্ত করার HTML কোড লিখ।
সমাধানঃ
<!DOCTYPE html> <html> <head> <title> List </title> </head> <body> <h2><u>About SAGC</u></h2> <ul type="square"> <li>School</li> <ol type="1"> <li> Morning Shift</li> <ol type="i"> <li>Bangla Version</li> <li>English Version</li> </ol> <li> Day Shift</li> <ul type="disc"> <li>Bangla Version</li> </ul> </ol> <li>College</li> <ul type="circle"> <li>XI</li> <li>XII</li> </ul> </ul> </body> </html>
উদ্দীপক অনুসারে প্রশ্নের উত্তর দাওঃ
ঢাকা বোর্ড-২৫
গ) উদ্দীপক লিস্টটি ওয়েবপেজে প্রদর্শনের HTML কোড লিখ।
সমাধানঃ
<!DOCTYPE html> <html> <head> <title>Car, Plane & Bike</title> </head> <body> <ol type="a" start="5"> <li>Car</li> <li>Plane <ol start="5"> <li>Fighter plane</li> <li><u>Commercial plane</u></li> <li>Private plane</li> </ol> </li> <li>Bike <ul type="disc"> <li>Super Bike</li> <li>Electric Bike</li> </ul> </li> </ol> </body> </html>
উদ্দীপক অনুসারে প্রশ্নের উত্তর দাওঃ
রাজশাহী বোর্ড-২০২৩
গ) উদ্দীপক লিস্টটি ওয়েবপেজে যুক্ত করার HTML কোড লিখ।
<!DOCTYPE html> <html> <head> <title> List </title> </head> <body> <ol type="1"> <li>Month</li> <ul type="circle"> <li>January</li> <li>February</li> </ul> <li>Day</li> <ul type="square"> <li>Sunday</li> <li>Monday</li> </ul> </ol> </body> </html>
উদ্দীপক অনুসারে প্রশ্নের উত্তর দাওঃ
সিলেট বোর্ড-২০২৩
গ) উদ্দীপক লিস্টটি ওয়েবপেজে যুক্ত করার HTML কোড লিখ।
<!DOCTYPE html> <html> <head> <title> List </title> </head> <body> <ol type="A" start="3"> <li>Coffee</li> <li>Tea</li> <ul type="disc"> <li>Black</li> <li>Green</li> </ul> <li>Milk</li> </ol> </body> </html>
উদ্দীপক অনুসারে প্রশ্নের উত্তর দাওঃ
দিনাজপুর বোর্ড-২০২৩
গ) উদ্দীপক লিস্টটি ওয়েবপেজে যুক্ত করার HTML কোড লিখ।
<!DOCTYPE html> <html> <head> <title> List </title> </head> <body> <ol type="1" start="2"> <li>ICT Book Writer Name:</li> <ul type="circle"> <li>Mr. X</li> <li>Mr. Y</li> </ul> <li>Bangla Book Writer Name:</li> <ul type="square"> <li>Mr. A</li> <li>Mr. B</li> </ul> </ol> </body> </html>
উদ্দীপকটি পড় এবং প্রশ্নের উত্তর দাও:
রিয়া দুইটি ওয়েবপেজ তৈরি করে। হোমপেজে নিচের লেআউটের মতো তথ্য প্রদর্শন করে। যেখানে লোগোটিতে ক্লিক করলে www.xyz.edu.bd এর ওয়েবসাইটটি ওপেন হয়।
গ) উদ্দীপকের হোমপেজের তথ্য প্রদর্শনে প্রয়োজনীয় HTML কোড লিখ।
সমাধানঃ
উদ্দীপকটি পড় এবং প্রশ্নের উত্তর দাও:
শুধুমাত্র HTML ব্যবহার করে চন্দনা মডেল কলেজের একটি ওয়েবসাইট তৈরি করা হয়। সাইটটির হোম পেজে ict.jpg নামের 200×300px আকারের একটি ছবি আছে। ছবিটির নিচে notice.html নামের notice পেজের একটি লিংক আছে। ছবির উপরে “Welcome to Chandana Model College” লেখাটি প্রদর্শিত হয়। সাইটটিতে ভিজিটরদের মতামত প্রদানের মতো কোন ব্যবস্থা নাই।
গ. উদ্দীপকে উল্লিখিত হোম পেজ তৈরির জন্য HTML কোড লিখ।
সমাধানঃ
উদ্দীপক অনুসারে প্রশ্নের উত্তর দাওঃ
রফিক স্যার ক্লাসে html সম্পর্কে আলোচনা করছিলেন এবং index.html নামে একটি ওয়েবপেইজ তৈরি করলেন। তিনি D ড্রাইভের picture ফোল্ডারের মধ্যে important ফ্লোল্ডারে রাখা logo.jpg নামক একটি ছবি 200×300 আকারে উক্ত ওয়েবপেইজে যুক্ত করলেন। অতঃপর তিনি ছাত্রদের বললেন তোমরা এমন একটি html কোড লেখ যাতে উক্ত ছবির উপর ক্লিক করলে www.xeducationboard.edu.bd ওয়েবসাইটটি প্রদর্শন হয়।
গ) উদ্দীপকে উল্লিখিত ছবিটি যুক্ত করার স্যারের HTML কোড লিখ।
ঘ) উদ্দীপকের দ্বিতীয় কাজটি করার জন্য কোডে কী কী পরিবর্তন করতে? বিশ্লেষণ কর।
সমাধান (গ):
<html> <head> <title> Image add </title> </head> <body> <img src="D:/picture/important/logo.jpg" width="200" height="300"> </body> </html>
সমাধান (ঘ):
উদ্দীপকের দ্বিতীয় কাজটি করার জন্য হাইপারলিংক করতে হবে। হাইপারলিংক করার জন্য <a> ট্যাগ ব্যবহার করা হয়। <a> ট্যাগের স্ট্রাকচার নিম্নরুপ-
<a href=”url”> Link Text/Image </a>
উপরিউক্ত স্ট্রাকচার ব্যবহার করে নিম্নরুপে কোডের পরিবর্তন করতে হবে।
<html> <head> <title> Image add </title> </head> <body> <a href="https://www.xeducationboard.edu.bd"> <img src="D:/picture/important/logo.jpg" width="200" height="300"> <a> </body> </html>
উদ্দীপক অনুসারে প্রশ্নের উত্তর দাওঃ
সিলেট বোর্ড-২০২৩
গ) উদ্দীপক টেবিলটি ওয়েবপেজে প্রদর্শের html কোড লিখ।
<!DOCTYPE html> <html> <head> <title> Table </title> </head> <body> <table border="1" cellspacing="0"> <tr> <th colspan="3"> Result </th> </tr> <tr> <th rowspan="2"> <u>ICT</u> </th> <th> CQ </th> <th> MCQ </th> </tr> <tr align="center"> <td> 45 </td> <td> 25 </td> </tr> <tr align="center"> <th> <u>English</u> </th> <td colspan="2" align="center"> 95 </td> </tr> </table> </body> </html>
উদ্দীপক অনুসারে প্রশ্নের উত্তর দাওঃ
ঢাকা বোর্ড-২০২৩
গ) উদ্দীপক টেবিলটি ওয়েবপেইজে প্রদর্শের html কোড লিখ।
<!DOCTYPE html> <html> <head> <title>A & H Company Ltd</title> </head> <body> <table border="1" cellspacing="0"> <tr> <th colspan="2">A & H Company Ltd</th> </tr> <tr> <th>Order List</th> <th>Unorder List</th> </tr> <tr> <td> <ol type="i"> <li>Book</li> <li>Paper</li> <li>Note Book</li> </ol> </td> <td> <ul type="square"> <li>Marker</li> <li>Ink</li> <li>Pencil</li> </ul> </td> </tr> </table> </body> </html>
উদ্দীপক অনুসারে প্রশ্নের উত্তর দাওঃ
গ) উদ্দীপক টেবিলটি ওয়েবপেইজে প্রদর্শের html কোড লিখ।
<!DOCTYPE html> <html> <head> <title> Table </title> </head> <body> <table border="1" cellspacing="0"> <tr> <th colspan="4"> About SAGC </th> </tr> <tr> <th rowspan="2"> School Section </th> <td> Morning Shift </td> <th rowspan="2"> College Section </th> <td> XI </td> </tr> <tr> <td> Day Shift </td> <td> XII </td> </tr> <tr align="center"> <td colspan="2"> <b>Time:</b> 7.15-4.35 </td> <td colspan="2"> <b>Time:</b> 7.15-1.00 </td> </tr> </table> </body> </html>
উদ্দীপক অনুসারে প্রশ্নের উত্তর দাওঃ
গ) উদ্দীপক টেবিলটি ওয়েবপেইজে প্রদর্শের html কোড লিখ।
সমাধানঃ
<html> <head> <title> Table </title> </head> <body> <table border="1" cellspacing="0"> <tr> <th>Science</th> <th>Commerce </th> <th>Humanities </th> </tr> <tr> <td> <ol type="A"> <li>Physic</li> <li>Chemistry</li> <li>Math</li> <li>Biology</li> </ol> </td> <td> <ul type="disc"> <li>Accounting</li> <li>Management</li> <li>Finance</li> <li>Statistic</li> </ul> </td> <td> <ol type="I"> <li>History</li> <li>Islamic History</li> <li>Home Science</li> <li>Economics</li> </ol> </td> </tr> </table> </body> </html>
উদ্দীপকটি লক্ষ কর এবং প্রশ্নের উত্তর দাওঃ
ঘ) উদ্দীপক টেবিলটি ওয়েবপেইজে প্রদর্শনের html কোড লিখ।
সমাধানঃ
<html> <head> <title> Table </title> </head> <body> <table border="1" cellspacing="0"> <tr> <th rowspan="2" valign="top"> AGE </th> <th colspan="2"> MEN </th> <th colspan="2"> WOMEN </th> <th> WEB ADDRESS </th> </tr> <tr> <th> NO </th> <th> % </th> <th> NO </th> <th> % </th> <td rowspan="4" align="center" valign="top"> www.bbs.gov.bd </td> </tr> <tr align="center"> <td> 16-25 </td> <td> 83 </td> <td> 26% </td> <td> 11 </td> <td> 3% </td> </tr> <tr align="center"> <td> 26-35 </td> <td> 147 </td> <td> 46% </td> <td> 109 </td> <td> 34% </td> </tr> <tr align="center"> <td> 36-45 </td> <td> 69 </td> <td> 21% </td> <td> 26 </td> <td> 40% </td> </tr> </table> </body> </html>
উদ্দীপকটি লক্ষ কর এবং প্রশ্নের উত্তর দাওঃ
রানা একটি ওয়েবসাইট তৈরি করে যেখানে home.html এবং about.html নামে দুটি ওয়েবপেইজ তৈরি করে। হোম পেইজে নিমোক্ত টেবিলটি দেখায় এবং about.html পেইজের সাথে হাইপারলিংক করে।
গ) উদ্দীপক টেবিলটি ওয়েবপেইজে প্রদর্শনের html কোড লিখ।
সমাধানঃ
<html> <head> <title> Table </title> </head> <body> <table border="1" cellspacing="0"> <tr> <th colspan="2">Heading</th> <td rowspan="2" align="right"> <ol type="A"> <li>Data1</li> <li>Data2</li> </ol> </td> </tr> <tr> <td rowspan="2"> <img src="logo.jpg" width="50" height="30"> </td> <td align="center"> Data </td> </tr> <tr> <td colspan="2" align="center"> <a href="about.html"> Go to about page </a> </td> </tr> </table> </body> </html>
উদ্দীপকটি লক্ষ কর এবং প্রশ্নের উত্তর দাওঃ
গ) উদ্দীপক টেবিলটি ওয়েবপেইজে প্রদর্শনের html কোড লিখ।
সমাধানঃ
<html> <head> <title> Table </title> </head> <body> <table border="1" cellspacing="0"> <tr> <th colspan="3"> Student Information </th> <td rowspan="3"> <img src="image.jpg" width="50" height="60"> </td> </tr> <tr> <th> ID </th> <th> Result </th> <th> Contact </th> </tr> <tr> <td> 101 </td> <td> A+ </td> <td> 01724351470 </td> </tr> </table> </body> </html>
উদ্দীপকটি লক্ষ কর এবং প্রশ্নের উত্তর দাওঃ
গ) উদ্দীপক টেবিলটি ওয়েবপেইজে প্রদর্শনের html কোড লিখ।
ঘ) উদ্দীপক টেবিলের সকল সারি(Row) কে স্তম্ভে (Column) এবং সকল স্তম্ভকে সারিতে পরিণত করলে যে টেবিল তৈরি হবে তা ওয়েবপেইজে প্রদর্শনের জন্য html কোড লিখ।
সমাধান (গ) ঃ
<html> <body> <head> <title> Table </title> </head> <table border="1" cellspacing="0"> <tr> <th> Student Name </th> <th colspan="3"> Compulsory </th> <th> Optional </th> </tr> <tr> <td rowspan="3"> Harry Porter </td> <td rowspan="3"> Bangla </td> <td rowspan="3"> English </td> <td rowspan="3"> ICT </td> <td> Physics </td> </tr> <tr> <td> Math </td> </tr> <tr> <td> Biology </td> </tr> </table> </body> </html>
সমাধান (ঘ) ঃ
উদ্দীপক টেবিলের সকল সারি(Row) কে স্তম্ভে (Column) এবং সকল স্তম্ভকে সারিতে পরিণত করলে নিচের টেবিলটি তৈরি হবে-
প্রাপ্ত টেবিলের এইচটিএমএল কোড-
<html> <head> <title> Table </title> </head> <body> <table border="1" cellspacing="0"> <tr> <th> Student Name </th> <th colspan="3"> Harry Porter </th> </tr> <tr> <th rowspan="3"> Compulsory </th> <td colspan="3"> Bangla </td> </tr> <tr> <td colspan="3"> English </td> </tr> <tr> <td colspan="3"> ICT </td> </tr> <tr> <th> Optional </th> <td> Physics </td> <td> Math </td> <td> Biology </td> </tr> </table> </body> </html>
উদ্দীপকটি লক্ষ কর এবং প্রশ্নের উত্তর দাওঃ
গ) উদ্দীপক টেবিলটি ব্রাউজারে প্রদর্শনের html কোড লিখ।
সমাধানঃ
<html> <body> <table border="1" cellspacing="0"> <tr> <th colspan="3"> Bangladesh </th> </tr> <tr> <td rowspan="3"> Rivers: <ul type="square"> <li>Padma</li> <li>Meghna</li> </ul> </td> <td colspan="2" align="center"> Padma Division </td> </tr> <tr> <td> Faridpur </td> <td> Gopalgonj </td> </tr> <tr> <td colspan="2" align="center"> Shariatpur </td> </tr> </table> </body> </html>
উদ্দীপকটি লক্ষ কর এবং প্রশ্নের উত্তর দাওঃ
গ) উদ্দীপক টেবিলটি ওয়েবপেইজে প্রদর্শনের html কোড লিখ।
সমাধানঃ
<html> <body> <table border="1" cellspacing="0"> <tr> <th> Science </th> <th> Humanities </th> <th> Business </th> </tr> <tr> <td> Girls=400 </td> <td> Girls=100 </td> <td> Girls=250 </td> </tr> <tr> <td> Boys=600 </td> <td> Boys=200 </td> <td> Boys=300 </td> </tr> <tr> <td colspan="3" align="center"> Total student=1850 </td> </tr> </table> </body> </html>
উদ্দীপকটি লক্ষ কর এবং প্রশ্নের উত্তর দাওঃ
ঘ) উদ্দীপক টেবিলটি ওয়েবপেইজে প্রদর্শনের জন্য html কোড লিখ।
সমাধানঃ
<html> <body> <table border="1" cellspacing="0"> <tr> <th colspan="2"> Heading1 </th> <th> Heading2 </th> </tr> <tr> <td rowspan="2" align="center"> (A+B)<sup>2</sup> </td> <td> </td> <td rowspan="2" align="center"> R </td> </tr> <tr> <td align="center"> S </td> </tr> <tr> <td colspan="2" align="center"> H<sub>2</sub>SO<sub>4</sub> </td> <td> </td> </tr> </table> </body> </html>
উদ্দীপকটি লক্ষ কর এবং প্রশ্নের উত্তর দাওঃ
গ) উদ্দীপক টেবিলটি ওয়েবপেইজে দেখানোর জন্য html কোড লিখ।
সমাধানঃ
<html> <body> <table border="1" cellspacing="0"> <tr> <td> <u>FRUITS:</u> <ul type="none"> <li> Apple </li> <li> Orange </li> <li> Banana </li> </ul> </td> <td> <u>DRINKS:</u> <ol type="A" start="3"> <li> 7-Up </li> <li> Pepsi </li> <li> Sprite </li </ol> </td> </tr> </table> </body> </html>
উদ্দীপকটি লক্ষ কর এবং প্রশ্নের উত্তর দাওঃ
গ) উদ্দীপক টেবিলটি ওয়েবপেইজে দেখানোর জন্য html কোড লিখ।
সমাধানঃ
<html> <body> <table border="1" cellspacing="0"> <caption> <b><u> Student Info </u></b> </caption> <tr> <th> SI </th> <th colspan="2"> Subjects </th> <th> Game </th> </tr> <tr> <td rowspan="2" align="center" valign="top"> 01 </td> <td rowspan="2" align="center" valign="top"> ICT </td> <td rowspan="2" align="center" valign="top"> Math </td> <td> Cricket </td> </tr> <tr> <td> Football </td> </tr> </table> </body> </html>
উদ্দীপকটি লক্ষ কর এবং প্রশ্নের উত্তর দাওঃ
ঘ) উদ্দীপক টেবিলটি ওয়েবপেইজে দেখানোর html কোড লিখ।
সমাধানঃ
<html> <body> <table border="1"> <tr> <th colspan="4"> Purchased Equipment </th> <tr> <tr> <th rowspan="2"> Item No. </th> <th rowspan="2"> Item Image </th> <th> Description </th> <th> Price </th> </tr> <tr> <th> Shipping </th> <th> Expanse </th> </tr> <tr> <td rowspan="2" align="center"> 1 </td> <td rowspan="2" align="center"> <img src="pc.jpg" width="60" height="70"> </td> <td> IBM </td> <td> $400 </td> </tr> <tr> <td> Shipping </td> <td> $40 </td> </tr> <tr> <th colspan="3"> Total Cost </th> <td> $440 </td> </tr> </table> </body> </html>
উদ্দীপকটি লক্ষ কর এবং প্রশ্নের উত্তর দাওঃ
ঘ) উদ্দীপক টেবিলটি ওয়েবপেইজে দেখানোর html কোড লিখ।
সমাধানঃ
<html> <body> <table border="1" cellspacing="0"> <tr> <th colspan="3"> ICT </th> </tr> <tr> <th rowspan="2"> Marks Distribution </th> <th> CQ </th> <th> MCQ </th> </tr> <tr align="center"> <td> 50 </td> <td> 25 </td> </tr> <tr> <th> Total </th> <td colspan="2" align="center"> 100 </td> </tr> </table> </body> </html>
উদ্দীপকটি লক্ষ কর এবং প্রশ্নের উত্তর দাওঃ
ঘ) উদ্দীপক টেবিলটি ওয়েবপেইজে দেখানোর html কোড লিখ।
সমাধানঃ
<html> <body> <table border="1"> <tr> <th> Name </th> <th> Exam </th> <th> GPA </th> <th> Photo </th> </tr> <tr> <td rowspan="2" align="center"> Atik </td> <td> SSC </td> <td> 5.00 </td> <td rowspan="2" align="center"> <img src="atik.png" width="100" height="120"> </td> </tr> <tr> <td> HSC </td> <td> 4.90 </td> </tr> </table> </body> </html>
উদ্দীপকটি লক্ষ কর এবং প্রশ্নের উত্তর দাওঃ
গ) উদ্দীপক টেবিলটি ওয়েবপেইজে দেখানোর html কোড লিখ।
সমাধানঃ
<html> <body> <table border="1" cellspacing="0"> <tr> <th rowspan="3"> GSM </th> <td> Grameenphone </td> </tr> <tr> <td> Airtel </td> </tr> <tr> <td> Banglalink </td> </tr> <tr> <th> CDMA </th> <td> CityCell </td> </tr> </table> </body> </html>
Written by,
- Mizanur Rahman (Mizan)
- Lecturer in ICT, Shaheed Bir Uttam Lt. Anwar Girls’ College , Dhaka Cantonment
- Founder & Author at www.edupointbd.com
- Software Engineer at mands IT
- Former Lecturer in ICT, Cambrian College, Dhaka
- Contact: 01724351470
sir please help me…
MNO ei likhatir majkane ekta kata dag…etike ki coad dhara prokash korbo…
That’s a big help thank you sir
Thank You Sir
Thank you so much sir…
Thank you so much sir