Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

CSS select elements with partial id

I have some elements generated with PHP and I would like to know if it is possible to select an element with an incomplete id, example:

<div class="1" id="as_1"> ... </div> <div class="2" id="bs_1"> ... </div>  <div class="1" id="as_2"> ... </div> <div class="2" id="bs_2"> ... </div> 

The class is being used to things they have in common, but now I need to select them individually but I don't know the entire id name.

Can I use something like:

#as_{ ... } #bs_{ ... } 
like image 908
Fernando Andrade Avatar asked Nov 23 '12 17:11

Fernando Andrade


People also ask

How do you select an element with ID part '?

The id selector uses the id attribute of an HTML element to select a specific element. The id of an element is unique within a page, so the id selector is used to select one unique element! To select an element with a specific id, write a hash (#) character, followed by the id of the element.

How do I target my CSS ID?

To use an ID selector in CSS, you simply write a hashtag (#) followed by the ID of the element. Then put the style properties you want to apply to the element in brackets.

How can we select an element with a specific class in CSS?

class selector selects elements with a specific class attribute. To select elements with a specific class, write a period (.) character, followed by the name of the class.

Can I select multiple elements at once with CSS?

When you group CSS selectors, you apply the same styles to several different elements without repeating the styles in your stylesheet. Instead of having two, three, or more CSS rules that do the same thing (set the color of something to red, for example), you use a single CSS rule that accomplishes the same thing.


1 Answers

Not with ID selectors since they require complete ID names, but with substring attribute selectors:

div[id^="as_"] div[id^="bs_"] 

But since your elements have a class attribute anyway, why not add a common class to each group of elements and select by that class to make things simpler? You should be able to determine the grouping class using PHP as you do to generate the IDs.

like image 64
BoltClock Avatar answered Oct 18 '22 10:10

BoltClock