সিএসএস দিয়ে লেখায় ব্লার ইফেক্ট যুক্ত করুন!

আসসালামু আলাইকুম। সবাইকে সিএসএস ট্রিক্স এ স্বাগতম। গত টিউটোরিয়ালে দেখিয়েছিলাম কিভাবে মেনুবারে গ্রোয়িং ইফেক্ট যুক্ত করবেন সিএসএস দিয়ে। এবার দেখাবো কিভাবে
সিএসএস ব্যবহার করে লেখার মধ্যে ব্লার ইফেক্ট দেওয়া যায়।

Untitled-1

তো চলুন কোডগুলো দেখে নিই-

নরমাল টেক্সট, ফন্ট, কালার এবং সাইজ ইত্যাদির জন্য নিচের কোডগুলো h3 সিলেক্টরে বসাতে হবে –
font: bold 80px Helvetica, Sans-Serif;

color: black;
color: rgba(0,0,0,0.2);

লেখায় ব্লার ইফেক্ট দেওয়ার  জন্য নিচের কোড দিতে হবে-
text-shadow:
0 0 2px rgba(0,0,0,0.2),
0 0 4px rgba(0,0,0,0.2),
0 0 6px rgba(0,0,0,0.2);
-webkit-transition: all 0.2s linear;

একসাথে কোড সব নিচে দেওয়া হল-

[css] <html>
<head>
<style type=text/css>
h3 {
height: 100px;
font: bold 80px Helvetica, Sans-Serif;

color: black;
color: rgba(0,0,0,0.2);

text-shadow:
0 0 2px rgba(0,0,0,0.2),
0 0 4px rgba(0,0,0,0.2),
0 0 6px rgba(0,0,0,0.2);
-webkit-transition: all 0.2s linear;
}
h3:hover {
color: rgba(28, 28, 28, 0.2);
opacity: 0.8;
letter-spacing: 15px;
font-size: 70px;
}
</style>
</head>
<body>
<h3>Blurred Effect</h3>
</body>
</html>[/css]

উপরের কোডগুলো কপি করে নোটপ্যাডে নিয়ে blur.html দিয়ে সেভ করুন। ব্রাউজারে ওপেন করে দেখুন।
ডেমো দেখুন এখানে

নিলুফার ইয়াসমিন

লেখিকা নিলুফার ইয়াসমিন সম্মান ৪র্থ বর্ষের শিক্ষার্থী। ইংরেজীতে ব্লগিং এর মাধ্যমে ব্লগিং হাতেকড়ি। বাংলা ব্লগেও তিনি বেশ কিছু তথ্যপূর্ণ পোস্ট লিখেন। বর্তমানে তিনি টিউটোহোস্টের সাপোর্ট ম্যানেজার পদে কর্মরত আছেন। 

Tags:


ফেসবুকের মাধ্যমে মন্তব্য লিখুন

Leave a Reply