সিএসএস এর ৩ নাম্বার পর্বে আপনাকে স্বাগতম । গত পর্বে আমরা ইনলাইন সিএসএস নিয়ে আলোচনা করেছিলাম আজ আরও কিছু শিখবো । আজকের পর্বে আমরা সিএসএস কোথাই লিখতে হয় এবং কিভাবে লিখতে হবে সেটা জানব । তো শুরু করা যাক আমাদের আজকের পর্ব ।
৩ ভাবে সিএসএস রুল লেখা যায়
২. ইন্টারনাল (Internal CSS) : আমরা নিচে এই নিয়ে আলোচনা করেছি । ৩. এক্সটার্নাল (External CSS) : নতুন একটা .css এক্সটেনশন দিয়ে ফাইল বানিয়ে সেখানে সিএসএস লেখা হয় আর এইচটিএমএল ফাইলে link ট্যাগ দিয়ে সংযুক্ত করে দিলেই কাজ হয়।
ইন্টারনাল (Internal CSS)
যেমন
01.<!DOCTYPE html>02.<html>03.<head>04.<style>05.h1{06.color: #f00;07.background: yellow;08.text-align: center;09.}10.</style>11.</head>12.<body>13. 14.<h1>This is Heading</h1>15. 16.<p>This is Paragraph.</p>17. 18.</body>19.</html>
Output
This is Heading
This is Paragraph.ব্যাখ্যা : ৪ থেকে ১০ নম্বর লাইন পর্যন্ত ইন্টারনাল সিএসএস লেখা হয়েছে।
সিএসএস কিভাবে লিখতে হয় সেটা এখানে খুব ভালভাবে দেখে নিন। এভাবেই সিএসএস লেখা হয় অর্থ্যাৎ প্রথমে সিলেক্টর (৪ নম্বর লাইনে h1) এরপর দ্বিতীয় বন্ধনীর (curly braces ) মধ্যে একটা একটা করে প্রেপার্টি এবং তার মান দেয়া হয়। যেমন ৬ নম্বর লাইনে color একটা প্রেপার্টি এবং এর মান দিয়েছি #f00 (এটা একটা কালার কোড যেটা লাল রং প্রদর্শন করায়) এভাবে বাকিগুলিও একইরকম।
** প্রোপার্টি এবং এর মানের মাঝে কোলন (:) চিহ্ন দিতে হবে এবং মানের শেষে সেমিকোলন (;) দিতে হবে তা নাহলে কোড কাজ করবেনা।
** ইন্টারনাল সিএসএস <head></head> ট্যাগের ভিতর লেখাই নিয়ম তবে ডকুমেন্টের অন্য কোথাও দিলেও কাজ করবে (সাধারনত body এলিমেন্টর ভিতরও দেয়া যায়)।
** প্রোপার্টি গুলির মান নির্দিষ্ট থাকে তাই শুধু সেগুলিই ব্যবহার করতে পারবেন।
যেমন text-align প্রেপার্টি টির মান ৫ ধরনের হতে পারে "left", "right", "center", "justify", "inherit" left দিলে এলিমেন্টের লেখাটি বামে দেখাবে।
right দিলে ডানে, justify দিলে দুদিকে সমান করে দেখাবে যেমন পত্রিকার কলামগুলি দেখায়।
center দিলে মাঝে এবং inherit দিলে প্যারেন্ট এলিমেন্টের টা প্রয়োগ হবে।
আবার color এর মান শুধু যেকোন বৈধ কালার কোড বা কালারের নামই হতে হবে তবে যেকোন রং হতে পারেন
যেমন আমি #foo দিয়েছি আপনি চাইলে #000 (কালো) বা অন্য কোন রং দিতে পারেন এমনকি রংয়ের নামও দেয়া যায়
যেমন maroon। যেমন আমি background প্রোপার্টির মান দিয়েছি #32373C ।
আজকের মত এই পর্যন্ত ই থাক পরবর্তী টিউটোরিয়াল দেখার আমন্ত্রণ জানিয়ে আজকের মত এখানেই শেষ করছি ।
0 comments:
Post a Comment