Can CSS Select Elements with Class Names Starting with a Specific String?-CSS Tutorial-php.cn

Can CSS Select Elements with Class Names Starting with a Specific String?

DDD

Release： 2024-11-14 16:05:02

Original

1012 people have browsed it

Can CSS Select Elements with Class Names Starting with a Specific String?

Can CSS Match Elements with Class Names Starting with a Specific String

Question:

In CSS, is there a way to use a "wildcard" to select elements with class names that start with a particular string?

Answer:

Yes, it is possible to match all elements whose class names begin with a specific string using the following CSS selectors:

[class^='string']: Matches elements whose class attribute starts with 'string'.
[class*=' string']: Matches elements whose class attribute contains 'string' anywhere.

Example:

To select and style all

elements with class names starting with "myclass":

div[class^='myclass'"], div[class*=' myclass'] {
    color: #f00;
}

Copy after login

In the provided HTML code:

<div class="myclass-one"></div>
<div class="myclass-two"></div>
<div class="myclass-three"></div>

Copy after login

The provided selectors will ensure that all three

elements have their text color set to red.

The above is the detailed content of Can CSS Select Elements with Class Names Starting with a Specific String?. For more information, please follow other related articles on the PHP Chinese website!

source：php.cn

Previous article：Why Isn't My CSS "top: 50%" Property Working? Next article：How Can SnappySnippet Help You Extract HTML CSS JS Code from Website Elements?

Statement of this Website

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn