সিএসএস অ্যাট্রিবিউট সিলেক্টর একটি href কাজ করে না

Question

বিভিন্ন বর্ণ এবং চিত্রের লিঙ্ক পরিবর্তন করতে আমার CSS এ বৈশিষ্ট্য নির্বাচনকারী ব্যবহার করতে হবে, তবে এটি কার্যকর হয় না।

আমার এই এইচটিএমএল আছে:

<a href="/manual.pdf">A PDF File</a>

এবং এই সিএসএস:

a {
     display: block;
     height: 25px;
     padding-left: 25px;
     color:#333;
     font: bold 15px Tahoma;
     text-decoration: none;
 }
 a[href='.pdf'] { background: red; }

কেন পটভূমি লাল হয় না?

Comments

+1 কারণ আমি কোনও [অ্যাট্রিবিউট = 'অ্যাট্রিবিউটনেম'] সম্পর্কে জানতাম না

— স্পেসবিয়ার

@ স্পেসবিয়ারস, এটিই element[attribute_name="attribute_value"]।

— জেএমএম

Answer 1

আপনার href এর পরে $ ব্যবহার করুন। এটি স্ট্রিংয়ের শেষের সাথে মেলে বিশেষের মানটিকে তৈরি করবে value

a[href$='.pdf'] { /*css*/ }

জেএসফিডাল: http://jsfiddle.net/UG9ud/

E[foo]        an E element with a "foo" attribute (CSS 2)
E[foo="bar"]  an E element whose "foo" attribute value is exactly equal to "bar" (CSS 2)
E[foo~="bar"] an E element whose "foo" attribute value is a list of whitespace-separated values, one of which is exactly equal to "bar" (CSS 2)
E[foo^="bar"] an E element whose "foo" attribute value begins exactly with the string "bar" (CSS 3)
E[foo$="bar"] an E element whose "foo" attribute value ends exactly with the string "bar" (CSS 3)
E[foo*="bar"] an E element whose "foo" attribute value contains the substring "bar" (CSS 3)
E[foo|="en"]  an E element whose "foo" attribute has a hyphen-separated list of values beginning (from the left) with "en" (CSS 2)

উত্স: http://www.w3.org/TR/selectors/

Comments

স্ট্রিংয়ের শেষে মেলে মানটির মান বোনাস মত শোনাচ্ছে !!

— জ্যাক

এই উত্তরে ডাব্লু 3 স্কুলগুলির চেয়ে নির্বাচকদের আরও ভাল ব্যাখ্যা রয়েছে।

— জেফ

Answer 2

গৃহীত উত্তর (ব্যবহার করে a[href$='.pdf']) ধরে নিয়েছে যে পিডিএফ-এর একটি লিঙ্ক সবসময়ই শেষ হবে .pdf। এটি অগত্যা নয়, কারণ লিঙ্কটিতে একটি ক্যোরি স্ট্রিং বা হ্যাশ টুকরা থাকতে পারে, উদাহরণস্বরূপ ইউটিএম ট্র্যাকিং কোড বা একটি পৃষ্ঠা নম্বর সহ, এই ক্ষেত্রে লিঙ্কগুলি মিলে না। আসলে আপনার আবেদনের উপর নির্ভর করে এটি বেশিরভাগ লিঙ্কের ক্ষেত্রে হতে পারে।

<a href="/manual.pdf?utm_source=homepage">A PDF File</a>
<a href="/manual.pdf#page=42">A PDF File</a>

আপনি যদি নিশ্চিত করতে চান যে আপনার নিয়মটিও সেই ক্ষেত্রে প্রয়োগ করা হয় আপনি .pdfব্যবহার করে গুণাবলীর যে কোনও জায়গায় মেলাতে পারেন

a[href*='.pdf']

তবে এটি তখন সাবডোমেনের মতো কিছু অপ্রত্যাশিত তবে অনিচ্ছাকৃত জিনিসের সাথে মিলবে our.pdf.domain.com/a-page। তবে আমরা এটিকে আরও সঙ্কুচিত করতে পারি, কারণ আমরা জানি আমরা কেবল এটির পিডিএফ ব্যবহার করব যাতে ক্যোরি স্ট্রিং বা হ্যাশ টুকরা রয়েছে। যদি আমরা 3 টি কেস একত্রিত করি তবে আমাদের সমস্ত পিডিএফ লিঙ্কের সাথে মেলে।

a[href$='.pdf'], a[href*='.pdf?'], a[href*='.pdf#'] {
    background: red;
}