CSS shadow – খুবই চমৎকার, খুবই সহজ

ওয়েব সাইট ডিজাইনাররা হয়তো বুঝতে পেরেছেন টিউটোরিয়াল টা কিসের উপর তদুপুরি সবার জন্য, দেখে নিন আউটপুট টি নিচের লিংক থেকে।

আগে নিচের ছবির মতো কিছু করতে হলে তা ক্যাবলমাত্র ছবির দ্বারাই সম্ভব হতো। কিন্তু CSS3 কল্যানে এখন তা CSS দ্বারাই সম্ভব। যা সরাসরি আমার দেয়া লিংকে দেখেছেন।

না খুব বেশী কিছু করতে হবেনা এমন ইফেক্ট আনার জন্য মাত্র ২ লাইন CSS প্রয়োজন। আমার উদাহরনে আমি একটি H2 এর উপরে apply করেছি। আপনি body, paragraph বা যেখানে খুশি লাগাতে পারেন।

আপনার যেকোন HTML এলিমেন্টএ নিচের কোড লাগালেই এইরকম ইফেক্ট পাবেন। [ আমার উদাহরনের কোড এটি ]

h2 {
font: 70px Tahoma, Helvetica, Arial, Sans-Serif;
text-align: center;
color: #222;
text-shadow: 0px 2px 3px #555;
}

মুল কোড হলো

h2 {

text-shadow: 0px 2px 3px #555;
}

উপরের বিভিন্ন ভ্যালু গুলি পরিবর্তন করে দেখতে পারেন। এই ৪টি ভ্যালুর কোনটি কি নিচের ছবিতে বর্ননা দিলাম।

Level 0

আমি সামির কবির। বিশ্বের সর্ববৃহৎ বিজ্ঞান ও প্রযুক্তির সৌশল নেটওয়ার্ক - টেকটিউনস এ আমি 11 বছর 10 মাস যাবৎ যুক্ত আছি। টেকটিউনস আমি এ পর্যন্ত 30 টি টিউন ও 130 টি টিউমেন্ট করেছি। টেকটিউনসে আমার 0 ফলোয়ার আছে এবং আমি টেকটিউনসে 0 টিউনারকে ফলো করি।

Freelancer web designer !


টিউনস


আরও টিউনস


টিউনারের আরও টিউনস


টিউমেন্টস

সুন্দর টিউন। সামনে আরও ভাল কিছু দিবেন সেই প্রত্যাশাই করব।

ধইন্যা

দারুন 🙂