আসসালামু আলাইকুম। কেমন আছেন প্রিয় টেকটিউনস এর বন্ধুরা। আলহামদুলিল্লাহ আমিও ভালো আছি। ওবে ডিজাইন এর বাংলা সিরিজ টিউটোরিয়ালের আজকের 17 তম পর্বের তৃতীয় খন্ডে আমি আপনাদেরকে স্বাগত জানাচ্চি ইন্জিনিয়ার মোঃ মারুফ সিদ্দিকী। আজ আমরা আলোচনা করবো HTML 5 এ কিভাবে CSS এর Framework কিভাবে ব্যাবহার করা হয়। মূলত ফ্রেমওয়ার্ক হলো CSS এর পার্ট। তবে এখানে আমি শুধু বেসিক ধারনা দিবো। আমি ব্যাক্তিগতভাবে ফ্রেমওয়ার্ক হিসাবে Bootstrap ব্যাবহার করে থাকি। তবে যেহেতু এই কোর্সটি W3School এর আদলে তৈরি তাই আমি এখানে আপনি কিভাবে W3.css ফ্রেমওয়ার্ক কিভাবে ব্যাবহার করবেন এবং তার ব্যাসিক ব্যাবহার দেখাবো।
W3.css একটি আধুনিক ফ্রেমওয়ার্ক । W3.css ব্যাবহার করার জন্য আমাদেরকে প্রথমে নিচের লাইনটিকে আপনার <head> section এ যোগ করুন।
<link rel=”stylesheet” href=”https://www.w3schools.com/w3css/4/w3.css”>
এই লাইনটি আপনার HTML এর <head> section এ সংযুক্ত করলেই আমাদের W3.css ফেমওয়ার্কটি কানেক্ট হয়ে যাবে। এবারে নিচের কোডটি খেয়াল করুন।
<div class=”w3-container w3-green”>
<h1>W3 School Demo</h1>
<p>Resize responsive web page</p>
</div>
<div class=”w3-row-padding”>
<div class=”w3-third”>
<h2>Bangladesh</h2>
<p>Dhaka is the capital of Bangladesh</p>
</div>
<div class=”w3-third”>
<h2>Pakisthan</h2>
<p>1971 we got freedom from pakistan</p>
</div>
<div class=”w3-third”>
<h2>Tokyo</h2>
<p>Tokyo is the capital of Japan</p>
</div>
</div>
আর্টিকেলটির সাথে সংযুক্ত ভিডিওটি ভালোভাবে দেখুন। আমি এই আর্টিকেলটির বিস্তারিত নিচের ভিডিওটিতে practically দেখিয়েছি। যারা লেখাটি পরে পরির্পর্ণভাবে বুঝতে পারেননি, তারা নিচের ভিডিওটি দেখে নিবেন। তার পরও কোন প্রশ্ন থাকলে আমাকে কমেন্ট করে জানাবেন।