2016-08-02 13 views
6

div[class^="kooy-"] काम नहीं कर रहा है। उसी समय div[class^="kooy"] परिणाम के रूप में परिणाम देता है।विशेषता चयनकर्ता के साथ शुरू होता है

<div class="kooy-tomato kooy"> 

ऐसा लगता है कि div[class^="kooy-"] केवल प्रथम श्रेणी प्राप्त करने में सक्षम है और एक पल के लिए नहीं लगता है:

div { 
 
    padding: 10px; 
 
    border: 1px solid skyblue; 
 
    margin-bottom: 10px; 
 
} 
 
div[class^="kooy-"] { 
 
    background-color: tomato; 
 
    color: white; 
 
}
<div class="kooy kooy-tomato">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quod a, nihil culpa rerum vero esse facilis sint voluptatem eius. Placeat, repudiandae, accusantium. Tempora, tempore ea pariatur molestias culpa quia id.</div> 
 

 
<div class="kooy">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Incidunt, eius illum. Adipisci pariatur, harum soluta inventore nihil cupiditate dolores ab cum ullam fugit amet, quae provident fuga ea dolorem nobis.</div>

उत्तर

3

आप अपनी कक्षाओं स्विच करते हैं दौर यह काम करने लगता है <div> जैसे तत्व पर कक्षा ^ केवल

विशेषता के भीतर पहली आइटम को देखती है

यहाँ एक fiddle

है कैसे कभी अगर आप कोशिश div[class*="kooy-"]* लग रहा है पर क्या attribure

यहाँ के भीतर निहित है एक fiddle

है आप CSS attribure selector

बारे में कुछ और जानना चाहते हैं
7

यह काम नहीं करता है क्योंकि class="kooy kooy-tomato"kooy- से शुरू नहीं होता है, यह kooy से शुरू होता है। आप विशेषता का उपयोग चयनकर्ता या [attr*=value] के बजाय कर सकते हैं।

div { 
 
    padding: 10px; 
 
    border: 1px solid skyblue; 
 
    margin-bottom: 10px; 
 
} 
 
div[class*="kooy-"] { 
 
    background-color: tomato; 
 
    color: white; 
 
}
<div class="kooy kooy-tomato">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quod a, nihil culpa rerum vero esse facilis sint voluptatem eius. Placeat, repudiandae, accusantium. Tempora, tempore ea pariatur molestias culpa quia id.</div> 
 

 
<div class="kooy">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Incidunt, eius illum. Adipisci pariatur, harum soluta inventore nihil cupiditate dolores ab cum ullam fugit amet, quae provident fuga ea dolorem nobis.</div>

+0

लेकिन फिर भी मुझे समझ नहीं आता क्यों ** ** काम नहीं कर के साथ शुरू! – Muhammed

+2

शुरुआत काम कर रहा है। लेकिन मूल्य "कोय-" से शुरू नहीं होता है। यह "कोय" से शुरू होता है। उत्तर चयनकर्ता को उस मान से मेल खाने से संशोधित करता है जो ('^') से शुरू होता है ('*')। https://www.w3.org/TR/css3-selectors/#selectors –

+1

ठीक उसी तरह माइकल ने कहा, यदि आप कक्षाओं के क्रम को बदलते हैं तो यह काम करेगा https://jsfiddle.net/Lg0wyt9u/1084/ –

संबंधित मुद्दे