Correction status:qualified
Teacher's comments:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>基础选择器</title> <style type="text/css"> ul{ margin: 100px auto; width: 420px; border: 1px dashed #c9c9c9; padding:10px 10px; } ul:after{ content: ""; display: block; clear: both; } li{ list-style: none; float: left; width: 30px; height: 30px; border-radius: 50%; background-color: #ea2000; line-height: 30px; text-align: center; color: #fff; margin-right:10px; } #item1{ background-color: blue; } .green{ background-color: #000; } ul li{ color: #38c5fa; } ul *{ border:1px solid #ff9800; } #item2 + li{ background-color: black; } #item3~li{ background-color: coral; } </style> </head> <body> <ul> <li id="item1">1</li> <li class="green">2</li> <li class="green">3</li> <li class="">4</li> <li>5</li> <li id="item2">6</li> <li id="item3">7</li> <li>8</li> <li>9</li> <li>10</li> </ul> </body> </html>
点击 "运行实例" 按钮查看在线实例