এইচটিএমএল স্টাইল - HTML Style



এইচটিএমএল এলিমেনটের স্টাইলিং এর জন্য সিএসএস ব্যবহার করা যায়।


সিএসএস দিয়ে এইচটিএমএল স্টাইলিং

সিএসএসের উদ্ভব হয়েছে এইচটিএমএল এলিমেনট স্টাইলিং এর জন্য। ৩ ভাবে এইচটিএমএল ডকুমেন্টে সিএসএস ব্যবহার করা যায়। যথা -
আলাদা স্টাইল শীট ব্যবহার করে ( সিএসএস ফাইল ),
এইচটিএমএলের হেড সেকশনে স্টাইল এলিমেনট ব্যবহার করে এবং
প্রতিটি এইচটিএমএল এলিমেনটের সাথে স্টাইল এট্রিবিউট ব্যবহার করে।


style এট্রিবিউট

inline স্টাইল অর্থাৎ প্রতিটি এইচটিএমএল এলিমেনটের সাথে স্টাইল এট্রিবিউট ব্যবহার করে এইচটিএমএল কন্টেন্টগুলো কে style করা যায়। style এট্রিবিউটেও সিএসএসের সকল প্রোপার্টি ব্যবহার করা যায়। নিচে এর সিনট্যাক্স দেখুন। এখানে property হল সিএসএস প্রপার্টি এবং value হল সিএসএস মান।

সিনট্যাক্স

<tagname style="property:value;">




টেক্সটের রঙ নির্ধারণ

style এট্রিবিউটে color প্রোপার্টি ব্যবহারের মাধ্যমে কোন এইচটিএমএল এলিমেন্টের লেখার রঙ নির্ধারণ করা যায়। নিচে একটি উদাহরণ দেখুন যেখানে style এট্রিবিউট এর মাধ্যমে লেখাগুলোর রঙ নির্ধারণ করা হয়েছে।

উদাহরণ

<h1 style="color:blue;">This is a heading</h1>
<p style="color:red;">This is a paragraph.</p>



টেক্সটের ফন্ট নির্ধারণ

font-family প্রোপার্টির মাধ্যমে এইচটিএমএল এলিমেন্টের ফন্ট নির্ধারণ করা হয়। নিচে একটি উদাহরণ দেখুন।

উদাহরণ

<h1 style="font-family:verdana;">This is a heading</h1>
<p style="font-family:courier;">This is a paragraph.</p>




ব্যাকগ্রাউন্ডের রঙ নির্ধারণ

background-color প্রোপার্টির মাধ্যমে একটি এইচটিএমএল এলিমেন্টের ব্যাকগ্রাউন্ডের রঙ নির্ধারণ করা হয়। নিচে একটি উদাহরণ দেখুন। এই উদাহরনটিতে ওয়েব পেজের ব্যাকগ্রাউন্ডের রঙ নির্ধারিত হবে aliceblue.

উদাহরণ

<body style="background-color:aliceblue;">
<h1>This is a heading</h1>
<p>This is a paragraph.</p>

</body>




লেখার অবস্থান নির্ধারণ

text-align প্রোপার্টি ব্যবহার করে এইচটিএমএল এলিমেন্টের কন্টেন্টের অবস্থান নির্ধারণ করা যায়। নিচে এর একটি উদাহরণ দেখুন।

উদাহরণ

<h1 style="text-align:center;">Centered Heading
<p style="text-align:center;">Centered paragraph.




লেখার আকার পরিবর্তন

font-size প্রোপার্টি বাবহার করে কোন এইচটিএমএল এলিমেন্টের টেক্সটের আকার নির্ধারণ করা করা যায়। নিচে এর একটি উদাহরণ দেখুন।

উদাহরণ

<h1 style="font-size:300%;">This is a heading</h1>
<p style="font-size:160%;">This is a paragraph.</p>




ডেপ্রিকেটেড ট্যাগ এবং এট্রিবিউট

এইচটিএমএল ৪.০১ এ কতগুলো ট্যাগ এবং এট্রিবিউট ডেপ্রিকেট বা বাতিল করা হয়েছে। ডেপ্রিকেট বলতে বোঝায় যে এইচটিএমএলের পরবর্তী ভার্সনগুলোয় এই ট্যাগ এবং এট্রিবিউট ব্যবহার করা হবে না।
যে সকল ট্যাগ এবং এট্রিবিউট ডেপ্রিকেট বা বাতিল করা হয়েছে সেগুলো হল -

ট্যাগ বর্ণনা
<center> Deprecated.কোন কন্টেন্টের অবস্থান মাঝখানে নির্ধারণ করে।
<font> এবং <basefont> Deprecated.এইচটিএমএল এ টেক্সট এর font নির্ধারণ করে।
<s> এবং <strike> Deprecated. টেক্সটের জন্য strikethrough স্টাইল নির্ধারণ করে।
<u> Deprecated.টেক্সটের জন্য underline স্টাইল নির্ধারণ করে।

এট্রিবিউট বর্ণনা
align Deprecated.টেক্সটের অবস্থান বা alignment নির্ধারণ করে।
bgcolor Deprecated.এই এট্রিবিউটের দ্বারা background এর রং নির্ধারণ করা হয়।
color Deprecated.লেখা বা টেক্সটের রং নির্ধারণ করে।

নোট - এই সকল ট্যাগ এবং এট্রিবিউটগুলো ব্যবহার করা উচিৎ নয়, এর পরিবর্তে সিএসএস ব্যবহার করা ভাল।







এই ওয়েব সাইট এর সমস্ত টিউটোরিয়াল, সার্কিট ডায়াগ্রাম, উদাহরণ ইত্যাদি খুব সহজ ও সাধারণ ভাবে তৈরি করা হয়েছে। টিউটোরিয়াল, সার্কিট ডায়াগ্রাম, উদাহরণ ইত্যাদির ভুল পরিহার করার জন্য বার বার যাচাই করা হয়েছে, কিন্তু আমরা এর পূর্ণ নিশ্চয়তা ও দায়ভার বহন করি না। যখন আপনি এই সাইটটি ব্যবহার করেন, আমরা ধরে নেই যে আপনি পড়েছেন এবং সম্মত আছেন আমাদের টার্মস অফ ইউস (Terms of use) এবং প্রাইভেসি পলিসি( Privacy policy) সম্পর্কে।

Report or suggest about this page

Copyright 2016-2018 by websschool.com, All Rights Reserved.