CSS Multi-Class Selector

Write more code, you will find that they are more and more ignorant, always thought HTML css is very simple, has mastered the very skilled, in fact, I am still a lot worse.

There is no use of CSS in peacetime . A.b{display:block;} The Internet is a check to understand.

Reference: http://www.w3school.com.cn/css/css_selector_class.asp

1. In HTML, a class value may contain a list of words separated by spaces. For example, if you want to mark a particular element as both important (important) and warning (warning), you can write (the order of the two words doesn't matter, warning important can be written as well):

<p class= "Important warning" >this paragraph is a very important warning.</p>

We assume that all elements of class important are bold, and that all elements of class warning are italic, and that all elements in class that contain both important and warning have a silver background. You can write:

. important {Font-weight:bold;}. Warning {font-weight:italic;}. important.warning {background:silver;}

2. By linking the two class selectors together, you can select only the elements that contain these class names (the order of the class names is unlimited).

If a multi-class selector contains a class name that is not in the list of class names, the match fails. Take a look at the following rules:

. important.urgent {background:silver;}

As expected, this selector will only match the P element that contains the word important and urgent in the class attribute. Therefore, if only the word important and warning are in the class attribute of a P element, it will not match. however , it can match the following elements:

<p class= "Important urgent warning" >this paragraph is a very important and urgent warning.</p>

CSS Multi-Class Selector