<h1>제목1</h1>
<h2>제목2</h2>
<table>
<caption>기본 필터 선택자</caption>
<colgroup>
<col>
<col>
<col>
</colgroup>
<tbody>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>4</td>
<td>5</td>
<td>6</td>
</tr>
<tr>
<td>7</td>
<td>8</td>
<td>9</td>
</tr>
<tr>
<td>10</td>
<td>11</td>
<td>12</td>
</tr>
</tbody>
</table>
<ul>
<li class="bg">내용1</li>
<li class="bg">내용2</li>
<li class="bg">내용3</li>
<li>내용4</li>
</ul> table {
border-collapse: collapse;
width: 100%;
}
td {
border: 1px solid #333;
}
li {
color: white;
margin: 5px;
} $(document).ready(function(){
$("tr:even").css("background","red")
$("tr:odd").css("background","orange")
$("td:first").css("background","yellow")
$("td:last").css("background","green")
$(":header").css("background","blue")
$("li:eq(0)").css("background","navy")
$("li:gt(0)").css("background","purple")
$("li:lt(3)").css("border", "4px solid gray")
$(":root").css("background", "lightgray")
(function upDown(){
$("h2").slideToggle(2000,upDown);
})();
$("animated").css("border","4px soild darkred")
})
External CSS
This Pen doesn't use any external CSS resources.