html শেখার সহজ উপায়

• html শেখার সহজ উপায় : অধ্যায় ১
• html শেখার সহজ উপায় : অধ্যায় ২
• html শেখার সহজ উপায় : অধ্যায় ৩

আমার আগের পোষ্ট গুলো যদি না দেখে থাকেন তবে চট করে একটু দেখে আসুন এতে আপনাদের বুঝতে সুবিধা হবে ।আজকে আমি আলোচনা করব html-এর font আর list  নিয়ে ।

Html font:-

ওয়েব পেজের font বা হরফের বিভিন্ন রকম স্টাইল প্রদর্শন করার জন্য ব্যবহৃত হয় Html font । ফন্টের গঠন <font> … </font> এই রকমের হয় ।তবে ফন্ট ট্যাগটি একাই কিছু করতে পারে না এজন্য তাকে সাহায্য করে থাকে কয়েকটি Attribute ।ফন্ট ট্যাগটি এবং Attribute গুলি নিয়ন্ত্রন করা যায় হরফের আকার ,বর্ন(রং) এবং হরফের ধরণ । নিচের ছকে ফন্ট ট্যাগের কয়েকটি প্রয়োজোনীয় Attribute দেখান হল ।

Attribute(-র নাম)	মান	কাজের বর্ননা
color	rgb(x,x,x)[যেমন rgb(102,204,51)] #xxxxxx (যেমন  #66cc33) colorname (যেমন green)	হরফের রং পরিবর্তন করতে ব্যবহৃত হয়
size	1 থেকে 7 পর্যন্ত যে কোন পূর্ন গানিতিক মান (যেমন 4)	হরফের আকার পরিবর্তন করতে  ব্যবহৃত হয়
face	হরফ গোষ্ঠির নাম (যেমন  SolaimanLipi)	হরফের ধরণ  পরিবর্তন করতে  ব্যবহৃত হয়

rgb(x,x,x),#xxxxxx সম্পর্কে পরে বিস্তারিত আলোচনা করব ।
যেভাবে লিখবেন
প্রথমে ফন্ট ট্যাগটি লিখে ফেলুন এরপর সূচনাকারি ট্যাগ অর্থাত্‍   <font>-এর মধ্যে Attribute-র নাম লিখে সমান চিহ্ন দিয়ে কোটেশন(“) চিহ্নের মধ্যে রাখুন Attribute-র মানটিকে
অর্থাত্‍  এরকম  হবে <font size=”3″ color=”red”> বিষয়বস্তু</font>

Html list:-

ওয়েব পেজে লেখার মধ্যে তালিকা করার সময় প্রয়োজন হয় list ট্যাগের ।তিন ধরনের Html list বিদ্যমান যথা ordered list,unordered list,definition list  ।
Ordered list:-
ordered list শুরু হয় <ol> ট্যাগ দিয়ে শেষ হয় </ol> ট্যাগ দিয়ে ।এর দুটি Attribute আছে , type আর start এই দুটি ।type Attribute-এর মান a,A,i,I,1 এই পাঁচটি হতে পারে ।start Attribute-এর মান type Attribute-এর উপর নির্ভর করে ।যদি type Attribute-এর মান a বা A হয় তবে start Attribute-এর মান a থেকে z পর্যন্ত যে কোন অক্ষর বা 1 থেকে 26 পর্যন্ত যে কোন পূর্ন গানিতিক সংখ্যা হতে পারে ।যদি type Attribute-এর মান i,I বা 1 হয় তবে start Attribute-এর মান যে কোন পূর্ন গানিতিক সংখ্যা হতে পারে ।
এর গঠন    নিচের কাঠামোর হয় ।

<ol type="1" start="1">
<h3>টপ টিজে </h3>
    <li>পুদিনা পাতা</li>
    <li>অনির্বাচিত টিউনার</li>
    <li>সার্ভার কুইন</li>
    <li>বান্দা_ ইখতিয়!র </li>
</ol>

Unordered list:-
unordered list শুরু হয় <ul> ট্যাগ দিয়ে শেষ হয় </ul> ট্যাগ দিয়ে ।এর শুধু type Attribute আছে , type  Attribute-এর মান square,circle বা dics ইত্যাদি হয়ে থাকে ।
এর গঠন নিচের কাঠামোর হয়

<ul type="circle" ><h3>টপ টিজে </h3>
    <li>পুদিনা পাতা</li>
     <li>অনির্বাচিত টিউনার</li>
     <li>সার্ভার কুইন</li>
     <li>বান্দা_ ইখতিয়!র </li></ul>

Definition list:-
Definition list এর ব্যবহার সাধারনত অভিধানে দেখা যায়।definition list শুরু হয় <dl> ট্যাগ দিয়ে শেষ হয় </dl> ট্যাগ দিয়ে ।<dl> tag ব্যাবহার করে Definition list তৈরী করা হয়। যাকে Define  করতে চাই তাকে bold আকারে দেখানো দরকার। Definition list tag এর মধ্যে আরও দুটি tag অর্ন্তভুক্ত সেগুলো হলো <dt> আর <dd> ।এর গঠন

<dl>
<dt><b>Rose</b></dt>
<dd>Rose is a pink coloured sweet smelled flower</dd>
<dt><b>William Shakespeare</b></dt>
<dd>William Shakespeare is one of the greatest writer.he said in his "Romeo and Juliet", "What's in a name? That which we call a rose by any other name would smell as sweet". - (Act II, Scene II).</dd>
</dt>

অনুশীলন করুন :- আজকের অলোচিত বিষয় গুলো সম্পর্কে ধারনা পরিস্কার করতে পাশের প্রদত্ত ছবিতে দেওয়া কোডগুলি নোডপ্যাডে লিখুন । লেখা শেষে নথিটিকে যেকোন নাম দিয়ে .html ফরম্যাট দিয়ে সংরক্ষণ করুন ।এবার সংরক্ষিত html নথিটিকে ক্লিক করে ব্রাউজারে খুলুন ।আমি এখানে notepad++ ব্যবহার করছি ।

বিশ্লেষণ:- উপরের ছবিতে দেওয়া কোড গুলিতে আজকে আলোচিত বিষয়গুলো লক্ষ্য করুন ।  ছয় নং লাইন থেকে নয় নং লাইনে Font ট্যাগ ব্যবহৃত হয়েছে । ১০ নং লাইন থেকে ১৬ নং লাইনে ব্যবহৃত হয়েছে ordered list ট্যাগ । ১৭ নং লাইন থেকে ২২ নং লাইনে ব্যবহৃত হয়েছে unordered list ট্যাগ । ২৩ নং লাইন থেকে ২৮ নং লাইনে ব্যবহৃত হয়েছে Definition list ট্যাগ ।

ব্রাউজারে আউটপুট