আমি CSS3 এ মোটামুটি নতুন এবং আমি নিম্নলিখিতগুলি করতে সক্ষম হতে চাই:
আমি যখন একটি উপাদানকে একটি শ্রেণি যুক্ত করি তখন এটি এই নির্দিষ্ট উপাদানটিতে ব্যবহৃত অন্য শ্রেণীর বৈশিষ্ট্যগুলিকে ওভাররাইড করে।
বলি যে আমার আছে
<a class="left carousel-control" href="#carousel" data-slide="prev">
আমি ক্লাস নামক একটি ক্লাস যুক্ত করতে সক্ষম হতে চাই bakground-none, এটি ক্লাসের ডিফল্ট পটভূমিকে ওভাররাইড করবে left।
ধন্যবাদ!
উত্তর:
বৈশিষ্ট্যগুলি ওভাররাইড করা যায় এমন বিভিন্ন উপায়ে রয়েছে। ধরে নিচ্ছি আপনার আছে
.left { background: blue }
উদাহরণস্বরূপ নিম্নলিখিতগুলির মধ্যে যে কোনও এটির ওভাররাইড করবে:
a.background-none { background: none; }
body .background-none { background: none; }
.background-none { background: none !important; }
নির্বাচক নির্দিষ্টকরণের দ্বারা প্রথম দুটি "জয়"; তৃতীয়টি জিতেছে !important, একটি ভোঁতা যন্ত্র।
আপনি আপনার স্টাইলের শীটগুলিও সাজিয়ে রাখতে পারেন যাতে নিয়ম
.background-none { background: none; }
হচ্ছে কেবল আদেশ, অর্থাত দ্বারা ধিক্কার জানাই পর একটি অন্যথায় সমানভাবে "শক্তিশালী" নিয়ম। তবে এটি বিধিনিষেধ আরোপ করে এবং স্টাইল শীটের যেকোন পুনর্গঠনে আপনাকে সতর্ক হওয়া দরকার।
এগুলি হ'ল সিএসএস ক্যাসকেডের একটি উদাহরণ , একটি গুরুত্বপূর্ণ তবে ব্যাপকভাবে বোঝা যায় না concept এটি স্টাইল শিটের বিধিগুলির মধ্যে বিরোধগুলি সমাধানের জন্য সঠিক বিধিগুলি সংজ্ঞায়িত করে।
PS আমি ব্যবহার করেছি leftএবং background-noneসেগুলি প্রশ্নে ব্যবহৃত হয়েছিল। এগুলি শ্রেণীর নামের উদাহরণ যা ব্যবহার করা উচিত নয় , কারণ তারা নির্দিষ্ট রেন্ডারিং প্রতিস্থাপন করে কাঠামোগত বা শব্দার্থিক ভূমিকা নয়।
button, name-labelইত্যাদি)। অন্যরা মনে করেন যে সিএসএস দুর্দমনীয় হয়ে যদি এই পদ্ধতির ব্যবহার এবং যেখানে শ্রেণীর সম্পত্তি মান (যেমন মিলা আপনি ব্যবহার করা উচিত "ইউটিলিটি প্রথম" বা "কার্মিক" CSS margin-top-4, width-10ইত্যাদি)। Icallyতিহাসিকভাবে "শব্দার্থক" পদ্ধতির প্রভাব রয়েছে এবং সম্প্রতি "কার্যকরী" পদ্ধতির অনুগতি লাভ করেছে। মাঝারি আকারের প্রকল্পে উভয়ই চেষ্টা করুন এবং তারপরে নিজের থেকে সিদ্ধান্ত নিন যে কোনটি উচ্চতর।
!importantএটির ব্যবহারটি ওভাররাইডে সহায়তা করবে
background:none !important;
যদিও এটি একটি খারাপ অনুশীলন হিসাবে বলা হয়, !importantইউটিলিটি ক্লাসগুলির জন্য দরকারী হতে পারে তবে আপনার এটি কেবল দায়িত্বের সাথে ব্যবহার করা উচিত, এটি পরীক্ষা করে দেখুন: গুরুত্বপূর্ণটি ব্যবহার করার সময় সঠিক পছন্দ
importantকীওয়ার্ডের বিকল্প হিসাবে আপনি নির্বাচককে আরও নির্দিষ্ট করে তুলতে পারেন, উদাহরণস্বরূপ:
.left.background-none { background:none; }
(দ্রষ্টব্য: শ্রেণীর নামের মধ্যে কোনও স্থান নেই)।
এই ক্ষেত্রে, বিধিটি প্রযোজ্য হবে যখন উভয়ই .leftএবং .background-noneশ্রেণি বৈশিষ্ট্যে তালিকাভুক্ত করা হবে (আদেশ বা নৈকট্য নির্বিশেষে)।
আপনি বাড়িয়ে ওভাররাইড করা উচিত নির্দিষ্টতা আপনার স্টাইলিং করুন। স্পেসিফিকেশন বাড়ানোর বিভিন্ন উপায় রয়েছে। !importantযার প্রভাব নির্দিষ্টকরণের ব্যবহার , এটি একটি খারাপ অভ্যাস, কারণ এটি আপনার স্টাইল শীটে প্রাকৃতিক ক্যাসকেডিং ভেঙে দেয়।
সিএসএস-ট্রিক্স ডট কম থেকে নেওয়া নিম্নলিখিত চিত্রটি আপনাকে পয়েন্ট কাঠামোর ভিত্তিতে আপনার উপাদানটির জন্য সঠিক সুনির্দিষ্টতা তৈরি করতে সহায়তা করবে। যার নির্দিষ্টকরণের উচ্চতর পয়েন্ট রয়েছে, তা জিতবে will একটি খেলা মত শব্দ - তাই না?
সিএসএস-ট্রিক্স ডট কম-এ এখানে নমুনা গণনার চেকআউট করুন । এটি আপনাকে ধারণাটি খুব ভালভাবে বুঝতে সহায়তা করবে এবং এটি কেবল 2 মিনিট সময় নেবে।
আপনি যদি নিজের দ্বারা আলাদা আলাদা আলাদা আলাদা বৈশিষ্ট্য তৈরি করতে এবং / বা তুলনা করতে চান তবে এই স্পেসিফিকেশন ক্যালকুলেটরটি ব্যবহার করে দেখুন: https://specificity.keegan.st/ বা আপনি কেবল সনাতন কাগজ / পেন্সিল ব্যবহার করতে পারেন use
আরও পড়ার জন্য MDN ওয়েব ডক্স চেষ্টা করুন ।
ব্যবহার না করার জন্য সেরা !important।
আপনি যদি bakground-noneঅন্যান্য ক্লাসের পরে ক্লাসটি তালিকাভুক্ত করেন তবে এর বৈশিষ্ট্যগুলি ইতিমধ্যে সেট করাগুলিকে ওভাররাইড করবে। এখানে ব্যবহার করার দরকার !importantনেই।
উদাহরণ স্বরূপ:
.red { background-color: red; }
.background-none { background: none; }
এবং
<a class="red background-none" href="#carousel">...</a>
লিঙ্কটির একটি লাল ব্যাকগ্রাউন্ড থাকবে না। অনুগ্রহ করে নোট করুন যে এটি কেবল এমন সংখ্যাকেই ওভাররাইড করে যাগুলির মধ্যে এমন একটি নির্বাচক রয়েছে যা কম বা সমানভাবে নির্দিষ্ট।
LIFO হল ব্রাউজারটি CSS বৈশিষ্ট্যগুলিকে পার্স করার উপায় .. আপনি যদি Sass ব্যবহার করছেন তবে হিসাবে পরিচিত একটি ভেরিয়েবল ঘোষণা করুন
"$ শিরোনাম-পটভূমি: লাল;"
এটি সরাসরি লাল বা নীল রঙের মতো মূল্য নির্ধারণের পরিবর্তে ব্যবহার করুন। আপনি যখন ওভাররাইড করতে চান তখন মানটি পুনরায় সাইন করুন
"$ শিরোনাম-পটভূমি: নীল"
তারপর
পটভূমি রঙ: er শিরোনাম-পটভূমি;
এটি সহজেই ওভাররাইড করা উচিত। "! গুরুত্বপূর্ণ" ব্যবহার করা সর্বদা সঠিক পছন্দ নয়..এটি কেবল একটি হটফিক্স
leftএবংbackground-noneএড়ানো উচিত ?