সিএসএস - সর্বজনীন '*' নির্বাচক বনাম এইচটিএমএল বা শরীরের নির্বাচক ব্যবহার করবেন?

Question

বডি ট্যাগে স্টাইল প্রয়োগ করা পুরো পৃষ্ঠায় প্রয়োগ করা হবে, তাই

body { font-family: Verdana }

পুরো পৃষ্ঠায় প্রয়োগ করা হবে। এটি দিয়েও করা যেতে পারে

* {font-family: Verdana} 

যা সমস্ত উপাদানগুলির জন্য প্রযোজ্য এবং তাই একই প্রভাব রয়েছে বলে মনে হয়।

আমি নীতিটি বুঝতে পারি যে প্রথম উদাহরণে শৈলী একটি পৃষ্ঠায় প্রয়োগ করা হচ্ছে, পুরো পৃষ্ঠার জন্য বডি, দ্বিতীয় উদাহরণে প্রতিটি পৃথক এইচটিএমএল উপাদানগুলির বিরুদ্ধে ফন্ট প্রয়োগ করা হচ্ছে। আমি যা জিজ্ঞাসা করছি তা করার ক্ষেত্রে ব্যবহারিক পার্থক্য কী, এর প্রভাবগুলি কী এবং কোনও কারণ, পরিস্থিতি বা সর্বোত্তম অনুশীলন যা একে অপরকে ব্যবহার করার দিকে পরিচালিত করে।

এক পার্শ্ব প্রতিক্রিয়া অবশ্যই গতি (+1 রব)। কার্যকারিতার দিক দিয়ে আমি একে অপরের থেকে একটি বেছে নেওয়ার আসল কারণটিতে সবচেয়ে আগ্রহী।

Comments

সম্ভব ক্রস সাইট ডুপ্লিকেট: stackoverflow.com/questions/7187569/...

— সিরো Santilli冠状病毒审查六四事件法轮功

Answer 1

সিএসএস নির্বাচক এই দুটি পছন্দের মধ্যে কার্যকরী পার্থক্য ... (আমার গ্রহণ)

শরীর

• শরীরের উপাদানগুলিতে শৈলীর বৈশিষ্ট্য প্রয়োগ করে।
• দেহের মধ্যে থাকা উপাদানগুলি সম্পত্তির মান উত্তরাধিকারী হতে পারে। কিছু সম্পত্তি 'উত্তরাধিকারী' এ ডিফল্ট।
• শৈলীর ঘোষণাগুলি যা দেহের অভ্যন্তরে কোনও উপাদানের সাথে মেলে তা উত্তরাধিকার সূত্রে প্রাপ্ত স্টাইলকে ওভাররাইড করতে পারে।

সর্বজনীন নির্বাচক * (সমস্ত উপাদান)

• সমস্ত পৃথক উপাদানগুলিতে শৈলীর বৈশিষ্ট্য প্রয়োগ করে।
• উত্তরাধিকার সূত্রে প্রাপ্ত স্টাইল বৈশিষ্ট্য এবং ডিফল্ট 'প্রাথমিক মান' প্রতিস্থাপন করে। ব্লকদের উত্তরাধিকার।
• অন্যান্য, আরও নির্দিষ্ট সিএসএস নির্বাচক যা কোনও উপাদানের সাথে মেলে তারা * দ্বারা প্রয়োগ করা স্টাইলের বৈশিষ্ট্যগুলিকে প্রতিস্থাপন করবে।

পরামর্শ

1. স্টাইলের বৈশিষ্ট্যগুলির জন্য বডি ব্যবহার করুন যা ডিফল্টরূপে হ'ল ফন্ট, রঙ হিসাবে উপাদানগুলির জন্য বুদ্ধিমান ডিফল্ট মান সরবরাহ করতে, প্রতিটি ক্ষেত্রেই স্পষ্টভাবে কোডের প্রয়োজনীয়তা হ্রাস করতে এবং শরীরের নীচের স্তরে থাকা উপাদানগুলির দক্ষতা সংরক্ষণ করে তাদের পিতামাতার উত্তরাধিকারী
2. সম্ভবত এক্ষেত্রে ইউনিভার্সাল সিলেক্টর * ব্যবহার না করাই ভাল। এটি শরীরের মধ্যে অন্যান্য উপাদানগুলির মধ্যে উত্তরাধিকারকে বাধাগ্রস্ত করে এবং ক্ষতিপূরণ দেওয়ার জন্য আপনাকে আরও সিএসএস বিধিগুলি লিখতে বাধ্য করতে পারে। এটি পৃষ্ঠাগুলি রেন্ডারিংকে ধীর করার একটি কারণ হতে পারে। এটি পৃষ্ঠার আকার এবং সামগ্রী এবং কতগুলি সিএসএস বিধি রয়েছে তার উপর নির্ভর করে।

Answer 2

এরকম কিছু চেষ্টা করুন

body { font-family: Verdana }
table { font-family: Arial }

বিরুদ্ধে

* { font-family: Verdana }
table { font-family: Arial }

এবং দেখুন টেবিলের কোষগুলিতে কোন স্টাইলগুলি প্রয়োগ করা হয়।

আপনি যখন ক্যাসকেডিং স্টাইলশিট নিয়ে কাজ করছেন তখন "পুরো ডকুমেন্টে প্রয়োগ করা" এবং "নথির প্রতিটি উপাদানকে প্রয়োগ করা" এর মধ্যে পার্থক্য রয়েছে ।

দেহে ক্যাসকেডিং স্টাইল প্রয়োগ করা কোনও ট্যাগ যখন ওভাররাইট না করে ততক্ষণ এটিকে শরীরের সমস্ত ট্যাগগুলিতে প্রয়োগ করে। তারপরে ওভাররাইট শৈলীটি সেই একের মধ্যে থাকা সমস্ত ট্যাগগুলিতে প্রয়োগ করা হয়।

তবে কিছু স্টাইল রয়েছে যা ক্যাসকেড হয় না, যেমন মার্জিন এবং প্যাডিং (সাধারণত যেখানে এটি কোনও অর্থ দেয় না)। এগুলি কেবলমাত্র নির্দিষ্ট ট্যাগগুলিতে প্রয়োগ করা যেতে পারে এবং সেখানেই কোনও ওয়াইল্ডকার্ড কাজে আসতে পারে (তবে খুব কমই)।

বেশিরভাগ নন-ক্যাসকেডিং শৈলীতেও উত্তরাধিকারের মান থাকে (উদাহরণস্বরূপ margin: inherit), যার অর্থ "প্যারেন্ট ট্যাগের মান গ্রহণ করুন"।

Comments

+1 ধন্যবাদ পার্থক্য কি কেবল টেবিল সম্পর্কে? আমি একটি উত্তর গ্রহণ করতে চাই যা অন্য উপাদানগুলির সাথে অন্যরকম আচরণ করা হয় সে সম্পর্কে কিছুটা সুস্পষ্ট বা বর্ণনামূলক, যেমন টেবিলগুলির সাথে দেখা হয়েছে। অতিরিক্ত কারণ বা পরিস্থিতি এক বা অন্যের দিকে যাওয়ার পক্ষেও ভাল।

— মাইকেল ডুরান্ট

@ মিশেলডুরান্ট: না, এটি ডিভের মধ্যে থাকা স্প্যানের ক্ষেত্রেও সমানভাবে প্রযোজ্য। তবে এটি লক্ষ করা উচিত যে কিছু স্টাইল যেমন মার্জিন এবং প্যাডিং শিশু উপাদানগুলিতে ক্যাসকেড দেয় না। তাদের জন্য, আপনার সমস্ত কিছুর জন্য প্রয়োগ করতে * ব্যবহার করা উচিত, তবে আপনি খুব কমই এটি করতে চান।

— পিডিআর

Answer 3

আমি সম্পূর্ণ বিশদটি ভুলে গিয়েছি তবে, * নির্বাচকের সাথে, প্রতিটি ব্রাউজার সিএসএস পার্স করার সাথে সাথে প্রতিটি উপাদান মূল্যায়ন করার সাথে সাথে পারফরম্যান্সটি ধীর হয়ে যায় এবং শৈলী প্রয়োগ করে। iirc, ফন্টটি সেট করা, এক্ষেত্রে, কেবল পিতামাতার কাছে প্রতিটি উপাদানগুলির জন্য একটি রেফারেন্স তৈরি করা হয় এবং অতিরিক্ত কাজের প্রয়োজন হয় না।

এছাড়াও কিছু অন্যান্য সমস্যা রয়েছে, তবে, আমি আবার সেগুলি সব মনে করি না এবং বছরগুলিতে ব্যবহার করি না।

Answer 4

ভাল সিএসএস ডিজাইনের সাধারণ গাইডলাইনটি যথাসম্ভব সুনির্দিষ্ট হতে হবে তবে আরও বেশি নয়।

সুতরাং, আপনার উদাহরণে, শরীরের উপাদানগুলিতে শৈলী প্রয়োগ করা যতটা সম্ভব সুনির্দিষ্ট এবং অবশ্যই '*' নির্বাচকের চেয়ে নির্দিষ্ট would

Answer 5

অন্যরা যেমন উল্লেখ করেছে, body { font-family: Verdana }কেবলমাত্র সেই উপাদানগুলির জন্য ভার্ডেনা হরফটি নির্বাচন করবে যা তার পিতামাতার কাছ থেকে সম্পত্তির উত্তরাধিকারী হয় font-styleযেমন এর সমস্ত পিতামাতারও সম্পত্তির উত্তরাধিকারসূত্রে bodyউপাদানটি গঠন করে এবং, সমস্ত উপাদানগুলির * {font-family: Verdana}জন্য ভার্ডেনা ফন্টটি নির্বাচন করবে । আমি একটি উদাহরণের সাথে পার্থক্যটি বর্ণনা করতে চাই:

বডি নির্বাচনকারী:

body 
{ 
font-family: courier;
}

<p> This is paragraph with courier font </p>
<form>
<label for="X">Please type inside me: </label><input type="text" naem="X" value="Not Courier :("> 
</form>

সর্বজনীন সেলেলেক্টর ব্যবহার *:

* 
{ 
font-family: courier;
}

<p> This is paragraph with courier font </p>
<form>
<label for="X">Please type inside me: </label><input type="text" naem="X" value="Courier :)"> 
</form>

আপনি যে <input>উপাদানটি ফন্ট-শৈলীতে পাবেন না সেগুলির উদাহরণগুলির CSS এবং এইচটিএমএল কোডগুলি ব্যবহার করুন এবং সুতরাং আপনি যে ফর্মটিতে টাইপ করেন তা ব্যবহারকারী-এজেন্ট স্টাইল শীটের ডিফল্ট ফন্ট-স্টাইল পায়। দ্বিতীয় উদাহরণে সর্বজনীন নির্বাচক *স্পষ্টভাবে উপাদান সহ প্রতিটি উপাদানগুলির জন্য ফন্ট-স্টাইল সেট করে input।