CSS চলকসমূহ

বুটষ্ট্ৰেপে ইয়াৰ কমপাইল কৰা CSS ত প্ৰায় দুডজন CSS স্বনিৰ্বাচিত বৈশিষ্ট্য (চলকসমূহ) অন্তৰ্ভুক্ত কৰে, প্ৰতি-উপাদান ভিত্তিত উন্নত স্বনিৰ্বাচনৰ বাবে অধিক ডজন বাটত আছে। এইবোৰে আপোনাৰ ব্ৰাউজাৰৰ পৰিদৰ্শক, এটা ক'ড ছেণ্ডবক্স, বা সাধাৰণ প্ৰ'ট'টাইপিঙত কাম কৰাৰ সময়ত আমাৰ থিম ৰং, ব্ৰেকপইণ্ট, আৰু প্ৰাথমিক ফন্ট ষ্টেকসমূহৰ দৰে সাধাৰণতে ব্যৱহৃত মানসমূহলৈ সহজ অভিগম প্ৰদান কৰে।

আমাৰ সকলো কাষ্টম বৈশিষ্ট্যbs- তৃতীয় পক্ষৰ CSS ৰ সৈতে সংঘাত এৰাই চলিবলৈ উপসৰ্গ কৰা হৈছে।

মূল চলকসমূহ

ইয়াত আমি অন্তৰ্ভুক্ত কৰা চলকসমূহ আছে (মন কৰিব যে :rootপ্ৰয়োজনীয়) যি Bootstrap ৰ CSS লোড কৰা যিকোনো ঠাইত অভিগম কৰিব পাৰি । সেইবোৰ আমাৰ _root.scssফাইলত অৱস্থিত আৰু আমাৰ কম্পাইল কৰা dist ফাইলসমূহত অন্তৰ্ভুক্ত কৰা হৈছে।

:root {
  --bs-blue: #0d6efd;
  --bs-indigo: #6610f2;
  --bs-purple: #6f42c1;
  --bs-pink: #d63384;
  --bs-red: #dc3545;
  --bs-orange: #fd7e14;
  --bs-yellow: #ffc107;
  --bs-green: #198754;
  --bs-teal: #20c997;
  --bs-cyan: #0dcaf0;
  --bs-white: #fff;
  --bs-gray: #6c757d;
  --bs-gray-dark: #343a40;
  --bs-primary: #0d6efd;
  --bs-secondary: #6c757d;
  --bs-success: #198754;
  --bs-info: #0dcaf0;
  --bs-warning: #ffc107;
  --bs-danger: #dc3545;
  --bs-light: #f8f9fa;
  --bs-dark: #212529;
  --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
}

উপাদান চলকসমূহ

আমি বিভিন্ন উপাদানৰ বাবে স্থানীয় চলক হিচাপে কাষ্টম বৈশিষ্ট্যসমূহো ব্যৱহাৰ কৰিবলৈ আৰম্ভ কৰিছো। এই ধৰণে আমি আমাৰ কমপাইল কৰা CSS হ্ৰাস কৰিব পাৰো, নেষ্টেড টেবুলসমূহৰ দৰে ঠাইত শৈলীসমূহ উত্তৰাধিকাৰী নহয় সুনিশ্চিত কৰিব পাৰো, আৰু Sass কমপাইলেচনৰ পিছত Bootstrap উপাদানসমূহৰ কিছুমান মৌলিক পুনৰায় ষ্টাইল আৰু সম্প্ৰসাৰণৰ অনুমতি দিব পাৰো।

আমি CSS চলকসমূহ কেনেকৈ ব্যৱহাৰ কৰিছো তাৰ কিছু অন্তৰ্দৃষ্টিৰ বাবে আমাৰ টেবুল নথিপত্ৰ চাওক ।

আমি আমাৰ গ্ৰীডসমূহৰ মাজেৰে CSS চলকসমূহো ব্যৱহাৰ কৰিছো—প্ৰাথমিকভাৱে নালাৰ বাবে—ভৱিষ্যতে অধিক উপাদানৰ ব্যৱহাৰ আহিব।

উদাহৰণ

CSS চলকসমূহে Sass ৰ চলকসমূহৰ সৈতে একেধৰণৰ নমনীয়তা প্ৰদান কৰে, কিন্তু ব্ৰাউজাৰলৈ সেৱা আগবঢ়োৱাৰ আগতে কম্পাইলেচনৰ প্ৰয়োজন নোহোৱাকৈ। উদাহৰণস্বৰূপে, ইয়াত আমি আমাৰ পৃষ্ঠাৰ ফন্ট আৰু লিংক শৈলীসমূহ CSS ভেৰিয়েবলসমূহৰ সৈতে ৰিছেট কৰিছো।

body {
  font: 1rem/1.5 var(--bs-font-sans-serif);
}
a {
  color: var(--bs-blue);
}