CSS

[CSS] :not(:first-child), :not(:last-child)

chsr 2020. 7. 10. 16:19
728x90
반응형

<!doctype html>
<html>
 <head>
  <meta charset="UTF-8">
  <title>예제</title>
  <style>
  	/* 예제 1 - td 첫번째 자식요소만 적용됨 */
	table tbody tr td:first-child {
		background-color: #ddd;  
	}

	/* 예제 2 - td 첫번째 자식요소를 제외한 나머지 td들이 적용됨 */
	table tbody tr td:not(:first-child) {
		background-color: #ddd;  
	}
  </style>
 </head>
 <body>
	<table border=1>
		<thead>
			<tr>
				<td>번호</td>
				<td>이름</td>
				<td>나이</td>
			</tr>
		</thead>
		<tbody>
			<tr>
				<td>1</td>
				<td>가나다</td>
				<td>20</td>
			</tr>
			<tr>
				<td>2</td>
				<td>라마바</td>
				<td>30</td>
			</tr>
			<tr>
				<td>3</td>
				<td>자차카</td>
				<td>40</td>
			</tr>
		</tbody>
	</table>
 </body>
</html>

 

728x90
반응형