বিজয় দিবস উপলক্ষ্যে লাল-সবুজের দুটি ওয়েব এলিম্যান্ট

ভূমিকা

বিজয়ের মাস। তাই ভাবলাম, আমাদের জাতীয় পতাকাটির যে কালার কম্বিনেশন, সেটা দিয়ে কিছু করি। বিজয় দিবসের উসিলায় কিছু মজার কাজ করার সুযোগ পাওয়া গেছে, এতেই আমি খুশি। মানুষ কত কিছু করে! ব্রাউজারের থিম বানায় লাল-সবুজের রঙে, এ্যাপ বানায়, কত্ত কিছু! আমি হইলাম মামুলি CSS ফ্যান। আমার দ্বারা যতটুকু সম্ভব, করার চেষ্টা করবো।

বিশেষভাবে উল্লেখ্য যে, এই ব্লগে যে উদাহরণগুলা দেয়া হয়, সেগুলার উপর ভিত্তি করে আপনি অনেক নতুন নতুন শ্যাপ, ডিজাইন এবং আইডিয়া তৈরি করতে পারবেন, যদি আপনি চান। তো … এখন যে কাজগুলোর লিঙ্ক এখানে দেবো, সেগুলোও একই রকম। উপলক্ষ্য বিজয় দিবস, কিন্তু যে কাজগুলো এখানে দেখানো হয়েছে, সেগুলোর উপর ভিত্তি করে আপনি অনেক ভাল ভাল এলিম্যান্ট বানাতে পারবেন আশা করি।

সেকশান-হেডার

আমরা আমাদের বিভিন্ন প্রোজেক্টে সেকশান হেডার ব্যবহার করি। অর্থাৎ, একটি ট্যাম্পলেটের বিভিন্ন সেকশান থাকতে পারে হোম পেইজে এবং অন্যান্য পেইজে। যেমন- About, Services অথবা বাংলায় পরিচয়, যোগাযোগ ইত্যাদি।

ওকে …. কোডসহ এখানে একটি সেকশান হেডারের ডেমো এখানে দেয়া হলো

See the Pen National Flag of Bangladesh in section-header by CSS only by Tanim Mahbub (@Tanim_Mahbub) on CodePen.

এটির ফুল-পেইজ ভিউ দেখার জন্য নিচের বাটনে ক্লিক করুন।

 

Live Demo

 

লিস্ট-স্টাইল (list-style)

দুইটা লিস্ট স্টাইল দেখানো হইল। আবারও বলছি, বিজয় দিবস উপলক্ষ্য মাত্র, এই উপলক্ষ্যে যে ডেমোগুলো দেখানো হলো, সেগুলোর উপর ভিত্তি করে নিজেরা ভিন্ন কিছু তৈরি করতে চেষ্টা করুন। নিচের লিস্ট-স্টাইলের কোডসহ প্রিভিউ দেয়া হলো-

See the Pen National Flag of Bangladesh in list-style by Tanim Mahbub (@Tanim_Mahbub) on CodePen.

 

আর লিস্ট-স্টাইল দু’টির ফুল-পেইজ প্রিভিউ দেখতে নিচের বাটনে ক্লিক করুন

Live Demo

 

আজকে এখানেই শেষ করছি, সবাই ভাল থাকবেন 

 
 

মন্তব্য

মন্তব্য