<!DOCTYPE html>
<html>
<head>
<title>Chạy thử Cách sử dụng lớp giả CSS :first-child</title>
<style>
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
ul{width:100%;float:left;heigt:auto;margin:0px;padding:0px}
ul li{margin:0px;padding:0px;list-style:none;padding:7px 5px; width:100%; background:red; float:left;height:auto;background:red;color:#000;border-top:1px solid green; color:#fff}
ul li:first-child{background:blue;}
</style>
</head>
<body>
<h1>Chạy thử Cách sử dụng lớp giả CSS :first-child</h1>
<p>Dùng để định dạng class đầu tiên trong các class giống nhau của phần tử cha hoặc định dạng phần tử con đầu tiên trong các phần tử con giống nhau trong phần tử cha.</p>
<ul>
<li>CSS :first-child</li>
<li>CSS :first-child</li>
<li>CSS :first-child</li>
<li>CSS :first-child</li>
<li>CSS :first-child</li>
<li>CSS :first-child</li>
</ul>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>Chạy thử Cách sử dụng lớp giả CSS :first-child</title>
<style>
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
ul{width:100%;float:left;heigt:auto;margin:0px;padding:0px}
ul li{margin:0px;padding:0px;list-style:none;padding:7px 5px; width:100%; background:red; float:left;height:auto;background:red;color:#000;border-top:1px solid green; color:#fff}
ul li:first-child{background:blue;}
</style>
</head>
<body>
<h1>Chạy thử Cách sử dụng lớp giả CSS :first-child</h1>
<p>Dùng để định dạng class đầu tiên trong các class giống nhau của phần tử cha hoặc định dạng phần tử con đầu tiên trong các phần tử con giống nhau trong phần tử cha.</p>
<ul>
<li>CSS :first-child</li>
<li>CSS :first-child</li>
<li>CSS :first-child</li>
<li>CSS :first-child</li>
<li>CSS :first-child</li>
<li>CSS :first-child</li>
</ul>
</body>
</html>
