📜  CSS 中用于类的通配符选择器(*、^ 和 $)

📅  最后修改于: 2021-08-29 13:14:18             🧑  作者: Mango

通配符选择器用于同时选择多个元素。它选择相似类型的类名或属性并使用 CSS 属性。 * 通配符也称为包含通配符。

[attribute*=”str”] 选择器: [attribute*=”str”] 选择器用于选择属性值包含指定子字符串str 的元素。此示例显示如何使用通配符选择包含str的类的所有 div。这可能是在课程的开始、结束或中间。
句法:

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

例子:



    
        
    
    
        

GeeksforGeeks

                            
The first div element.
        
The second div element.
        
The third div element.
        

Paragraph Text

    

输出:

[attribute^=”str”] 选择器: [attribute^=”value”] 选择器用于选择那些属性值以指定值str开头的元素。此示例显示如何使用通配符选择所有类以str开头的 div。

句法:

[attribute^="str"] {
    // CSS property
}

例子:



    
        
    
    
        

GeeksforGeeks

                            
The first div element.
        
The second div element.
        
The third div element.
        
The fourth div element.
        

Paragraph Text

    

输出:

[attribute$=”str”] 选择器: [attribute$=”value”] 选择器用于选择那些属性值以指定值str结尾的元素。以下示例选择具有以str结尾的类属性值的所有元素。

句法:

[attribute$="str"] {
    // CSS property
}

例子:



    
        
    
    
        

GeeksforGeeks

                            
The first div element.
        
The second div element.
        
The third div element.
        

This is some text in a paragraph.

                                      

输出: