আইডিতে পিরিয়ড সহ সিএসএস নির্বাচক

Question

এইচটিএমএল স্পেসটি একটি আইডিতে পিরিয়ড (।) এর জন্য অনুমতি দেয়:

<img id="some.id" />

তবে সিএসএস আইডি নির্বাচক নিয়ম ব্যবহার করবে না সঠিকভাবে মেলে:

#some.id { color: #f00; }

আইডি সিলেক্টরদের জন্য সিএসএস স্পেস এই মামলার উল্লেখ করে না। সুতরাং আমি ধরে নিই এটি কোনও ট্যাগ নাম এবং শ্রেণি নির্বাচকের সংমিশ্রণটি ব্যবহার করছে ? উদাহরণস্বরূপ, এর একটি সিএসএস বিধি a.classNameসমস্ত অ্যাঙ্কর ট্যাগগুলিতে ( <a>) এর classNameমতো শ্রেণির নামের সাথে প্রযোজ্য <a class="className"></a>।

কোনও আইডিএম উপাদানকে তার আইডি দ্বারা নির্দিষ্ট সময়সীমার উল্লেখ করে এমন কোনও বহিরাগত সিএসএস ফাইল বিধি থাকা কি সম্ভব?

আমি আশা করি না যেহেতু সিএসএস স্পেস নির্দিষ্ট করে যে কোনও সিএসএস " সনাক্তকারী " সময়টিকে বৈধ চরিত্র হিসাবে অন্তর্ভুক্ত করে না। সুতরাং এইচটিএমএল এবং সিএসএস স্পেকসের মধ্যে এটি কি মৌলিক অমিল? বিভিন্ন ধরণের সিএসএস নির্বাচন ব্যবহার করার জন্য কি আমার একমাত্র বিকল্প? আমি নিশ্চিত হওয়া বা অস্বীকার করার চেয়ে আরও চৌকস কেউ কি পারেন?

(জিনিসগুলি সরল করার জন্য আমি এইচডিএমএল আইডি বৈশিষ্ট্যটি থেকে পিরিয়ডটি সরিয়ে ফেলব তবে এটি একটি সিস্টেম-উত্পন্ন আইডি, তাই এই ক্ষেত্রে এটি পরিবর্তন করার ক্ষমতা আমার নেই))

Comments

আপনি বলতে পারেন যে এটি এইচটিএমএল এবং সিএসএসের মধ্যে একটি মৌলিক অমিল। তবে, তারা দুটি পৃথক ভাষা হওয়ায় এটি মিলবে বলে আশা করা যায় না; এইচটিএমএল সনাক্তকারী হ'ল এইচটিএমএল শনাক্তকারী এবং সিএসএস শনাক্তকারী একটি সিএসএস শনাক্তকারী। এছাড়াও, সিএসএস কেবলমাত্র এইচটিএমএল নয়, অন্যান্য ভাষাগুলিকেও স্টাইল করতে পারে (যদিও মঞ্জুরি দেওয়া হয়, সিএসএস শুরুতে HTML এর জন্য তৈরি হয়েছিল)।

— বোলটলক

এছাড়াও #some.idআইডি এবং শ্রেণি নির্বাচক সমন্বয় ব্যবহার করা হয়।

— বোলটলক

আইডি হ'ল স্টাইল হুক হিসাবে আপনার থাকা একমাত্র বৈশিষ্ট্য কি? আমি জানি এটি সামান্য অফ-টপিক, তবে আমি ভাবছি আপনি কেন আইএমজি বা ক্লাসের পরিবর্তে আইডি ব্যবহার করতে চান (যদি উপলব্ধ থাকে)।

— জেএক্স

@ জাএক্স আর আর "আইএমজি (ট্যাগ) বা ক্লাসের পরিবর্তে আইডি কেন ব্যবহার করবেন?" এটি প্রচুর কারণ এবং পরিস্থিতিতে পরিবর্তিত হয়। তবে এই ক্ষেত্রে, কোনও নির্দিষ্ট উপাদানটির স্টাইলযুক্ত প্রয়োজন, পৃষ্ঠার সমস্ত চিত্র নয়। এইচটিএমএল সংশোধন করতে পারলে একটি শ্রেণি ব্যবহার করা যেতে পারে, তবে এই ক্ষেত্রে এটি আমাদের নিয়ন্ত্রণের বাইরে কোনও সিস্টেমের দ্বারা উত্পাদিত হওয়ায় এটি সংশোধন করা যায়নি।

— জন অ্যাডামস

Answer 1

আরও কিছুটা চশমা খনন করার পরে, আমি দেখতে পেলাম যে সিএসএস স্পেকটি বেশিরভাগ ভাষার মতো ব্যাকস্ল্যাশ ( \) পলায়নের অনুমতি দেয় ।

সুতরাং আমার উদাহরণে, নিম্নলিখিত নিয়মটি মিলবে:

#some\.id {
  color: #f00;
}

Comments

ভাল গবেষণা কাজ। এর মতো আরও প্রশ্নোত্তর থাকতে হবে, "আমার পরিবর্তে আমার কোড লিখবেন না" like

— পাভলো

চমৎকার গবেষণা। আমি কেবল এটি জুড়ে একটি বড় এন্টারপ্রাইজ অ্যাপ্লিকেশন এ ছড়িয়েছি im আমি সম্পূর্ণ স্টাম্পড হয়েছি এবং এর আগে কখনও দেখিনি। এর মধ্যে পিরিয়ড দিয়ে আইডি বানানোর কী আছে ??

— অ্যান্টনি

@ অ্যান্টনি: এইচটিএমএল আইডি বৈশিষ্ট্যে পিরিয়ড রাখার নির্দিষ্ট কারণ নেই। আমার ধারণা কখনও কখনও লেখকেরা কেবল চান? সম্ভবত কিছু ক্ষেত্রে এটি অন্তর্নিহিত প্রয়োগকারী সিস্টেমগুলি থেকে রক্তপাত হতে পারে যা ফর্ম প্রসেসিংয়ের জন্য সার্ভার-সাইড কোডের সনাক্তকারীগুলিতে পিরিয়ড ব্যবহার করতে পারে? আমি নিশ্চিত যে যার যার যার নিজস্ব কারণ রয়েছে; তবে সেগুলি অন্তর্ভুক্ত করার কোনও HTML / CSS কারণ নেই।

— জন অ্যাডামস

ধন্যবাদ, ওপেনলায়ার্সের সাথে আমার সমস্যা ছিল কারণ এটি এর আইডিতে বিন্দু ব্যবহার করে না। উদাহরণস্বরূপ: "ওপেনলায়ার্স ont কন্ট্রোল.অ্যাট্রিবিউশন_7"। আমি অনুমান করি যে এটি অভ্যন্তরীণ কোডের সাথে সহায়তা করে যেখানে তারা জাভাস্ক্রিপ্ট ভেরিয়েবলের নামটি আইডি হিসাবে একই মান হতে পারে।

— হফম্যান

আমি একটি নতুন প্রশ্ন যুক্ত করার এবং নিজের উত্তর লেখার কথা বিবেচনা করছি, তবে এখানে কেবল মন্তব্য করার সিদ্ধান্ত নিয়েছি। আপনি যদি স্টাইলাস প্রিপ্রসেসর ব্যবহার করে থাকেন #some\\.idতবে বিশেষ অক্ষরটি থেকে বাঁচতে আপনার দুটি ব্যাকস্ল্যাশ ব্যবহার করা দরকার । প্রথম ব্যাকস্ল্যাশটি স্টাইলাস গ্রাস করেছে, অবশিষ্ট ব্যাকস্ল্যাশটি সংকলিত সিএসএসে ফেলেছে, যা এই উত্তরে বর্ণিত পছন্দসই ফলাফল অর্জন করে।

— মার্ক্রিয়ান

Answer 2

আপনি এই জাতীয় বৈশিষ্ট্য নির্বাচনকারীটিকেও ব্যবহার করতে পারেন :

[id='some.id'] {
  color: #f00;
}

Comments

এটি কিছু ব্রাউজারে কাজ করতে পারে তবে আমি বৈশিষ্ট্য নির্বাচনকারীদের জন্যও ত্রুটিগুলি ফেলেছি। আপনি এখনও এড়াতে পারেন ., যেমন \.।

— ক্রিস জেইনস

Answer 3

আপনি যেহেতু আইডি ব্যবহার করছেন তাই আপনি ডকুমেন্ট.জেটএলমেন্টবিআইআইডি () ব্যবহার করতে পারেন যা আইডি মানটিকে একটি সাধারণ স্ট্রিং হিসাবে পরীক্ষা করে না সিএসএস নির্বাচককে। যেমন নীচেরগুলিও কাজ করে:

const myElem = document.getElementById("some.id");

একমাত্র ত্রুটি, আপনি সন্ধানের ক্ষেত্র সীমাবদ্ধ করতে পারবেন না, যেমন আপনি ক্যোয়ারী নির্বাচনকারী উদাহরণস্বরূপ কিছুElement.querySelector () দিয়ে করতে পারেন। তবে যেহেতু আইডিগুলি সর্বদা অনন্য হওয়া উচিত তাই আইডি সহ একটি ডকুমেন্টের প্রশস্ত অনুসন্ধান বৈধ valid