作业1:
作业2:
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>常用选择器</title> <style> 标签选择器: ul{ padding: 0; margin: 0; border: 1px dashed #666; padding: 10px 5px; } /*子块撑开父级区块*/ ul:after{ content: ' '; display: block; clear: both; } ul li{ list-style: none; float: left; width: 40px; height: 40px; line-height: 40px; text-align: center; border-radius: 20%; box-shadow: 2px 2px 2px #ccc; background-color: skyblue; margin: 5px; } ul li[class$="pig"] + li{ background-color: pink; color: black; } </style> </head> <body> <ul> <li id="item1">1</li> <li class="cat pig dog">2</li> <li>3</li> <li>4</li> <li>5</li> <li>6</li> <li>7</li> <li>8</li> <li>9</li> <li>10</li> </ul> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例