Correction status:Uncorrected
Teacher's comments:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>CSS控制列表</title> <style type="text/css"> .list { width: 400px; height: 500px; background-color: lightskyblue; border: 1px solid lightgray; border-radius: 2%; box-shadow: 5px 5px 10px 0; } .list h2 { padding: 0 15px 0 15px; text-indent:2em; } p { padding: 0 30px 0 15px; font-size: 14px; text-align: right; /*color: gray;*/ } .item { /*1. list-style-type: ; list-style-type:disc; list-style-type: circle; list-style-type: square; list-style-type: decimal; list-style-type: decimal-leading-zero;*/ padding:15px; line-height:2em; background-color: lightyellow; /*background-color: #f4ff0a;*/ /*2.list-style-image: url();*/ list-style-image: url(http://www.mi-888.com/php/zuoye/20180323/play.jpg); /*3.list-style-position: ;*/ list-style-position: inside; /*list-style-position: outside;*/ } .item li { background-color: lightyellow; } .item li a { text-decoration: none; } .item li a:hover { text-decoration: underline; color: red; font-size: 1.05em; } </style> </head> <body> <div class="list"> <h2>第二期全栈开发培训班直播课堂实录更新中...</h2> <ul class="item"> <li><a href="">第二期全栈开发培训班直播课堂实录更新中1</a></li> <li><a href="">第二期全栈开发培训班直播课堂实录更新中2</a></li> <li><a href="">第二期全栈开发培训班直播课堂实录更新中3</a></li> <li><a href="">第二期全栈开发培训班直播课堂实录更新中4</a></li> <li><a href="">第二期全栈开发培训班直播课堂实录更新中5</a></li> <li><a href="">第二期全栈开发培训班直播课堂实录更新中6</a></li> <li><a href="">第二期全栈开发培训班直播课堂实录更新中7</a></li> <li><a href="">第二期全栈开发培训班直播课堂实录更新中8</a></li> <li><a href="">第二期全栈开发培训班直播课堂实录更新中9</a></li> <li><a href="">第二期全栈开发培训班直播课堂实录更新中10</a></li> </ul> <p>在线观看人数:2018</p> </div> </body> </html>
点击 "运行实例" 按钮查看在线实例