ওয়েবসাইট ইমেজ, টেক্সট, এবং বিভিন্ন নথি সহ বিভিন্ন পৃথক টুকরা গঠিত হয়। এই নথিতে শুধুমাত্র এমন পৃষ্ঠাগুলি অন্তর্ভুক্ত নয় যা PDF পৃষ্ঠাগুলির মতো বিভিন্ন পৃষ্ঠাগুলির সাথে লিঙ্কযুক্ত হতে পারে, তবে পৃষ্ঠাগুলি এবং CSS (ক্যাসকেডিং স্টাইল শীট) নথির কাঠামো নির্ধারণ করতে HTML পৃষ্ঠাগুলি যেমন পৃষ্ঠাগুলি গঠন করতে ব্যবহার করা হয় সেগুলিও নথিভুক্ত করে। একটি পৃষ্ঠার চেহারা dictate। এই নিবন্ধটি CSS এ ঢুকে পড়বে, এটি কী এবং কীভাবে এটি আজ ওয়েবসাইটে ব্যবহৃত হয় তা আচ্ছাদন করে।
একটি CSS ইতিহাস পাঠ
সিএসএসটি 1997 সালে প্রথম বিকাশকারী ওয়েব ডেভেলপারদের ওয়েব পেজগুলির দৃশ্যমান রূপ নির্ধারণ করার উপায় হিসাবে তৈরি হয়েছিল। ওয়েব ভিজুয়ালগুলি ভিজ্যুয়াল ডিজাইন থেকে ওয়েবসাইটের কোডের বিষয়বস্তু এবং কাঠামো পৃথক করার অনুমতি দেয়, এমন কিছু যা এই সময়ের পূর্বে সম্ভব ছিল না।
কাঠামো এবং শৈলী বিচ্ছেদ এইচটিএমএলটিকে ফাংশনটির আরো কার্য সম্পাদন করতে দেয় যা মূলত এটির উপর ভিত্তি করে তৈরি হয়েছিল - সামগ্রীটির মার্কআপ, পৃষ্ঠাটির নকশা এবং লেআউট সম্পর্কে চিন্তা না করেই, যা সাধারণত "চেহারা এবং অনুভূতি" হিসাবে পরিচিত। পৃষ্ঠার।
প্রায় 2000 সাল পর্যন্ত ওয়েব ব্রাউজারগুলি এই মার্কআপ ভাষার মৌলিক ফন্ট এবং রঙের দিকগুলির চেয়ে বেশি ব্যবহার করে সিএসএস জনপ্রিয়তা পায়নি। আজ, সমস্ত আধুনিক ব্রাউজার সিএসএস লেভেল 1 সমর্থন করে, সিএসএস লেভেল 2 এর বেশিরভাগই এবং সিএসএস লেভেলের বেশিরভাগ দিকগুলিও সিএসএস 3 সাপোর্ট করে। সিএসএস চলতে থাকে এবং নতুন স্টাইল চালু হয়, ওয়েব ব্রাউজারগুলি এমন মডিউল বাস্তবায়ন শুরু করে যা নতুন CSS সমর্থন আনতে পারে। যারা ব্রাউজার মধ্যে এবং ওয়েব ডিজাইনার শক্তিশালী নতুন স্টাইলিং সরঞ্জাম সঙ্গে কাজ দিতে।
(বহু) বছর আগে, ওয়েব ডিজাইনাররা ওয়েবসাইটগুলির নকশা ও উন্নয়নের জন্য সিএসএস ব্যবহার করতে অস্বীকার করেছিল, কিন্তু সেই অনুশীলনটি আজও শিল্প থেকে চলে গেছে। সিএসএস এখন ওয়েব ডিজাইনে ব্যাপকভাবে ব্যবহৃত মান এবং আপনি এই শিল্পের অন্তত একটি মৌলিক বোঝার না থাকা শিল্পে কাজ করে এমন যে কেউ খুঁজে বের করতে কঠোর চাপে পড়বেন।
সিএসএস একটি সংক্ষেপে
ইতিমধ্যে উল্লেখ করা হয়েছে, সিএসএস শব্দটি "ক্যাসকেডিং স্টাইল শীট" হিসাবে দাঁড়িয়েছে। এই ডকুমেন্ট কি কি আরো ব্যাখ্যা সম্পূর্ণরূপে এই ফ্রেজ একটি বিট নিচে বিরতি।
"স্টাইলশীট" শব্দটিকে নথিতে নিজেই বোঝায় (এইচটিএমএল, সিএসএস ফাইলগুলি আসলেই কেবল পাঠ্য নথি যা বিভিন্ন প্রোগ্রামের সাথে সম্পাদিত হতে পারে)। স্টাইল শীট অনেক বছর ধরে নথি নকশা জন্য ব্যবহার করা হয়েছে। তারা একটি লেআউট জন্য প্রযুক্তিগত বৈশিষ্ট্য, মুদ্রণ বা অনলাইন কিনা। মুদ্রণ ডিজাইনাররা তাদের ডিজাইনগুলি সঠিকভাবে তাদের নির্দিষ্টকরণগুলিতে মুদ্রিত হয় তা নিশ্চিত করার জন্য দীর্ঘ স্টাইল শীট ব্যবহার করেছেন। একটি ওয়েব পৃষ্ঠার জন্য একটি স্টাইল শীট একই উদ্দেশ্যে কাজ করে, তবে ওয়েব ব্রাউজারকে কীভাবে ডকুমেন্ট দেখানো হচ্ছে তা রেন্ডার করার অতিরিক্ত কার্যকারিতা সহ। আজ, সিএসএস স্টাইল শীট বিভিন্ন ধরণের ডিভাইস এবং স্ক্রিন মাপের জন্য কোনও ভাবে দেখায় তা পরিবর্তন করতে মিডিয়া প্রশ্নগুলি ব্যবহার করতে পারে। এটি অবিশ্বাস্যভাবে গুরুত্বপূর্ণ কারণ এটি অ্যাক্সেস করার জন্য ব্যবহৃত স্ক্রীনের অনুসারে একটি একক HTML নথিটি ভিন্নভাবে রেন্ডার করতে দেয়।
ক্যাসকেডটি "ক্যাসকেডিং স্টাইল শীট" শব্দটির সত্যিই বিশেষ অংশ। একটি ওয়েব স্টাইল শীটটি সেই শিটের শৈলীগুলির মাধ্যমে একটি জলপ্রপাতের উপর একটি নদীর মতো ক্যাসকেড করার উদ্দেশ্যে তৈরি করা হয়। নদীতে পানি জলপ্রপাতের সমস্ত পাথরকে আঘাত করে, তবে নীচে কেবলমাত্র পানিগুলি প্রবাহিত হবে ঠিক যেখানেই প্রবাহিত হয়। একই ওয়েবসাইট স্টাইল শীট মধ্যে ক্যাসকেড সত্য।
ওয়েব ডিজাইনার কোনো শৈলী প্রয়োগ না করেও, প্রতিটি ওয়েব পৃষ্ঠা অন্তত একটি স্টাইল শীট দ্বারা প্রভাবিত হয়। এই স্টাইল শীটটি ব্যবহারকারীর এজেন্ট স্টাইল শীট - ডিফল্ট শৈলী হিসাবেও পরিচিত যা ওয়েব ব্রাউজার কোনও পৃষ্ঠা প্রদর্শনের জন্য ব্যবহার করবে যদি অন্য কোনো নির্দেশনা প্রদান করা হয় না। উদাহরণস্বরূপ, ডিফল্ট হাইপারলিঙ্কগুলি নীল স্টাইলযুক্ত এবং তারা আন্ডারলাইনযুক্ত। ঐ শৈলী একটি ওয়েব ব্রাউজার এর ডিফল্ট শৈলী শীট থেকে আসে। ওয়েব ডিজাইনার অন্যান্য নির্দেশাবলী সরবরাহ করলে, তবে ব্রাউজারকে কোন নির্দেশনা অগ্রাধিকার দেওয়া উচিত তা জানতে হবে। সকল ব্রাউজারে তাদের নিজস্ব ডিফল্ট শৈলী রয়েছে, তবে ডিফল্টগুলির (যেমন নীল আন্ডারলাইনযুক্ত লিখিত লিঙ্কগুলি) অনেকগুলি বা সর্বাধিক প্রধান ব্রাউজার এবং সংস্করণগুলিতে ভাগ করা হয়।
ব্রাউজার ডিফল্টের আরেকটি উদাহরণের জন্য, আমাদের ওয়েব ব্রাউজারে, ডিফল্ট ফন্টটি "টাইমস নিউ রোমান" 16 আকারে প্রদর্শিত হয়। তবে যে ফন্টের পরিবার এবং আকারের মধ্যে আমরা যে পৃষ্ঠাগুলি দেখি তার প্রায় কোনও পৃষ্ঠা নেই। কারণ এই ক্যাসকেডটি আমাদের ওয়েব ব্রাউজারের ডিফল্টগুলিকে ওভাররাইড করার জন্য ফন্ট সাইজ এবং পরিবারকে পুনরায় সংজ্ঞায়িত করার জন্য ডিজাইনারদের দ্বারা নির্ধারিত দ্বিতীয় স্টাইল শীটগুলি সংজ্ঞায়িত করে। ওয়েব পেজের জন্য তৈরি কোন স্টাইল শীটগুলিতে ব্রাউজারের ডিফল্ট শৈলীগুলির চেয়ে আরও নির্দিষ্টতা থাকবে, তাই ডিফল্টগুলি শুধুমাত্র তখনই প্রযোজ্য হবে যদি আপনার স্টাইলশীট তাদের ওভাররাইড না করে। যদি আপনি নীল এবং আন্ডারলাইনে লিঙ্কগুলি চান তবে আপনাকে ডিফল্ট হিসাবে কিছু করতে হবে না, তবে যদি আপনার সাইটের CSS ফাইলটি বলে যে লিঙ্কটি সবুজ হওয়া উচিত তবে সেই রঙটি ডিফল্ট নীলকে ওভাররাইড করবে। আপনি অন্যথায় উল্লেখ না করার পরে নিম্নরেখা এই উদাহরণে থাকবে।
কোথায় সিএসএস ব্যবহৃত হয়?
ওয়েব ব্রাউজারের চেয়ে অন্যান্য মিডিয়াতে দেখা হলে কীভাবে ওয়েব পৃষ্ঠাগুলি দেখানো উচিত তা নির্ধারণ করতে CSS ব্যবহার করা যেতে পারে। উদাহরণস্বরূপ, আপনি একটি মুদ্রণ শৈলী শীট তৈরি করতে পারেন যা ওয়েব পৃষ্ঠাটি কীভাবে মুদ্রণ করা উচিত তা নির্ধারণ করবে। যেহেতু ন্যাভিগেশন বোতামগুলি বা ওয়েব ফর্মগুলির মতো ওয়েব পৃষ্ঠা আইটেমগুলি মুদ্রিত পৃষ্ঠায় কোনও উদ্দেশ্য রাখবে না, একটি পৃষ্ঠা মুদ্রণের সময় মুদ্রণ শৈলীটি সেগুলি "বন্ধ করা" করতে ব্যবহার করা যেতে পারে।যদিও অনেক সাইটগুলিতে প্রকৃতপক্ষে সাধারণ অভ্যাস না হলেও মুদ্রণ শৈলী পত্র তৈরি করার বিকল্পটি শক্তিশালী এবং আকর্ষক (আমাদের অভিজ্ঞতার মধ্যে - বেশিরভাগ ওয়েব পেশী কেবল এই কাজটি করে না কারণ বাজেটের কোনও সাইট এই অতিরিক্ত কাজটি করার জন্য কল করে না )।
কেন সিএসএস গুরুত্বপূর্ণ?
CSS ওয়েব ডিজাইনার শিখতে পারে এমন সবচেয়ে শক্তিশালী সরঞ্জামগুলির মধ্যে একটি কারণ এটির সাথে আপনি একটি ওয়েবসাইটের সম্পূর্ণ দৃশ্যমান চেহারাটি প্রভাবিত করতে পারেন। ওয়েল লিখিত স্টাইল শীটগুলি দ্রুত আপডেট করা যেতে পারে এবং স্ক্রীনে দৃশ্যমানভাবে যা অগ্রাধিকার দেওয়া হয় তা পরিবর্তন করতে সাইটগুলিকে অনুমতি দেয়, যা পরিণামে দর্শকদের কাছে মান এবং ফোকাস দেখায়, কোনও অন্তর্নিহিত HTML মার্কআপে কোনও পরিবর্তন করার প্রয়োজন নেই।
সিএসএসের প্রধান চ্যালেঞ্জটি হল শিখতে অনেক কিছু আছে - এবং ব্রাউজারের সাথে প্রতিদিন পরিবর্তন হচ্ছে, আজকের দিনে ভাল কী কাজ করে সেগুলি আগামীকাল বুঝতে পারে না কারণ নতুন শৈলীগুলি সমর্থিত হয়ে থাকে এবং অন্যরা এক কারণে বা অন্যের পক্ষে অনুপস্থিতিতে পড়ে যায় বা পড়ে যায়। ।
সিএসএস ক্যাসকেড এবং একত্রিত হতে পারে এবং বিভিন্ন ব্রাউজারগুলি বিভিন্ন নির্দেশাবলী ব্যাখ্যা করতে এবং বাস্তবায়ন করতে পারে কিনা তা বিবেচনা করে, সিএসএসটি মাস্টার্সের চেয়েও বেশি জটিল হতে পারে। সিএসএস ব্রাউজারেও এমনভাবে পরিবর্তন করে যে এইচটিএমএল সত্যিই না। একবার আপনি সিএসএস ব্যবহার শুরু করলে, আপনি দেখতে পাবেন যে স্টাইল শীটগুলির শক্তিটি ব্যবহার করা আপনাকে ওয়েব পৃষ্ঠাগুলি কীভাবে সজ্জিত করে এবং তাদের চেহারা এবং অনুভূতি সংজ্ঞায়িত করে তা অবিশ্বাস্য নমনীয়তা দেয়। পাশাপাশি, আপনি শৈলী এবং পন্থাগুলি যা অতীতে আপনার জন্য কাজ করেছেন এবং "ভবিষ্যতের নতুন ওয়েব পৃষ্ঠাগুলি তৈরি করার পরে আপনি আবার চালু করতে পারেন এমন কৌশলগুলির" কৌশলগুলির ব্যাগ "সংগ্রহ করবেন।
জেনারেল ক্রাইনিনের মূল নিবন্ধ। 7/5/17 তারিখে জেরেমি গিরার্ড দ্বারা সম্পাদিত