Is there a CSS selector for elements containing certain text?

后端 未结 18 2426
别跟我提以往
别跟我提以往 2020-11-21 04:26

I am looking for a CSS selector for the following table:

Peter    | male    | 34
Susanne  | female  | 12

Is there any selector to match all

18条回答
  •  天涯浪人
    2020-11-21 05:09

    @voyager's answer about using data-* attribute (e.g. data-gender="female|male" is the most effective and standards compliant approach as of 2017:

    [data-gender='male'] {background-color: #000; color: #ccc;}
    

    Pretty much most goals can be attained as there are some albeit limited selectors oriented around text. The ::first-letter is a pseudo-element that can apply limited styling to the first letter of an element. There is also a ::first-line pseudo-element besides obviously selecting the first line of an element (such as a paragraph) also implies that it is obvious that CSS could be used to extend this existing capability to style specific aspects of a textNode.

    Until such advocacy succeeds and is implemented the next best thing I could suggest when applicable is to explode/split words using a space deliminator, output each individual word inside of a span element and then if the word/styling goal is predictable use in combination with :nth selectors:

    $p = explode(' ',$words);
    foreach ($p as $key1 => $value1)
    {
     echo ''.$value1.';
    }
    

    Else if not predictable to, again, use voyager's answer about using data-* attribute. An example using PHP:

    $p = explode(' ',$words);
    foreach ($p as $key1 => $value1)
    {
     echo ''.$value1.';
    }
    

提交回复
热议问题