Home > Enterprise >  How would I use a wildcard in a css selector?
How would I use a wildcard in a css selector?

Time:11-28

link[type*="application/* xml"]

I'm trying to match either rss xml or atom xml so I want to use a wildcard in that spot.

CodePudding user response:

You can use a $ wildcard, which selects element whose attribute value ends with a specified value.

div{
  width: 300px;
  height: 300px;  
}

link[type$="rss xml"]   div{
  background: green;
}

link[type$="atom xml"]   div{
  background: red;
}
<link type="application/rss xml" />
<div></div>
<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

CodePudding user response:

Wildcard selector is used to select multiple elements simultaneously.

[attribute*="value"] { 
    // CSS property 
}

It will look like this

[class*="str"] {
    background: green;
    color: white;
}

For Example:- You can do like this.

<div class="first_str">The first div element.</div>
<div class="second">The second div element.</div>
<div class="my-strt">The third div element.</div>
<p class="mystr">Paragraph Text</p>

Now it will select all classes, named with str like:- first_str, my-strt, mystr

  •  Tags:  
  • css
  • Related