ওয়েব সাইটের প্রধান উপাদান হচ্ছে টেক্সট। সৌন্দর্য বৃদ্ধির জন্য এবং বিশেষ কিছু সুবিধা পাবার জন্য css এর মাধ্যমে টেক্সট এর স্টাইল তৈরি করা হয়। টেক্সট এর স্টাইল তৈরির জন্য বেশ কয়েকটি বিষয় Declaration এ উল্লেখ করতে হয়। এগুলো হচ্ছে
- টেক্সট কালার (Text Color)
- টেক্সট এলাইনমেন্ট (Text Alignment)
- টেক্সট ডেকরেশন (Text Decoration)
- টেক্সট ট্রান্সফরমেশন (Text Transformation)
টেক্সট কালার (Text Color)
আমরা সাধারণত HTML এর মাধ্যমে টেক্সট ব্যবহারের জন্য <P>, <h1>,<h2>,<a> সহ আরো কিছু ট্যাগ ব্যবহার করি। এসকল টেক্সট এর কালার নির্ধারণের জন্য Declaration করতে হবে p { color: #FC9 } বা এর অনুরূপ। p এর স্থানে অন্যান্য ট্যাগের ক্ষেত্রে h1, h2 , a, body, অথবা কোন ট্যাগের id বা class বসতে পারে। টেক্সট এর কালার নির্ধারণের জন্য তিন ধরণের Declaration হতে পারে। যেমন
p { color: #FC9}
p {color:blue;}
p {color:rgb(255,0,0);}
p {color:blue;}
p {color:rgb(255,0,0);}
অনুশীলন প্রজেক্ট
<html>
<head>
<title> www.tutohost.com</title>
<style>
body{background:#090}
h1{color:#C00;}
p{color:blue;}
.mar{color:rgb(150,0,0); font-size:25px;}
</style>
</head>
<body >
<h1>www.tutohost.com</h1>
<p>
We are bangladeshi Hostgator hosting provider.<br />
We are bangladeshi Hostgator hosting provider. <br />
We are bangladeshi Hostgator hosting provider. <br />
</p>
<marquee>
<p class="mar"> 24 / 7 Support</p>
</marquee></body></html>
<head>
<title> www.tutohost.com</title>
<style>
body{background:#090}
h1{color:#C00;}
p{color:blue;}
.mar{color:rgb(150,0,0); font-size:25px;}
</style>
</head>
<body >
<h1>www.tutohost.com</h1>
<p>
We are bangladeshi Hostgator hosting provider.<br />
We are bangladeshi Hostgator hosting provider. <br />
We are bangladeshi Hostgator hosting provider. <br />
</p>
<marquee>
<p class="mar"> 24 / 7 Support</p>
</marquee></body></html>
একটা নোটপ্যাড open করে উপরের code টুকু লিখে file মেনু থেকে Save as এ ক্লিক করে File name: index.html , Save as type : All files, দিয়ে save করে index.html ফাইলটি Mozilla Firefox দিয়ে open করলে নিচে প্রদর্শিত ছবির মত দেখাবে।
0 comments: