How to exclude the first element and style other elements in css-CSS Tutorial-php.cn

How to exclude the first element and style other elements in css

WBOY

Release： 2021-11-29 17:46:07

Original

10482 people have browsed it

In CSS, you can use the ":first-child" and ":not" selectors to select other elements except the first element and set the styles of other elements. The syntax is "element:not(: first-child){css style code;}".

How to exclude the first element and style other elements in css

The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.

How to exclude the first element and set styles for other elements in css

In css, you can use the ":first-child" selector and The ":not" selector is used to style elements other than the first element.

:first-child selector is used to select the specified selector that belongs to the first child element of its parent element.

:not(selector) The selector matches every element that is not the specified element/selector.

Let’s take a look at an example. The example is as follows:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <style>
tr:not(:first-child){
background-color:red;
}
</style>
<table border="1" class="tab">
  <tr>
    <td>111</td>
    <td>222</td>
  </tr>
  <tr>
    <td>333</td>
    <td>444</td>
  </tr>
    <tr>
    <td>555</td>
    <td>666</td>
  </tr>
  <tr>
    <td>777</td>
    <td>888</td>
  </tr>
</table>
</body>
</html>

Copy after login

Output result:

How to exclude the first element and style other elements in css

(Learning video sharing: css video tutorial)

The above is the detailed content of How to exclude the first element and style other elements in css. For more information, please follow other related articles on the PHP Chinese website!