<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>京东播图</title> <style> p { border: 1px #041807 solid; /*边框-颜色*/ padding: 10px; /*声明内边框属性 可调距离*/ height: 8px; width: 8px; border-radius: 50%; margin: 3px auto; background-color: #ffec19; position: relative; top: -80px; right: -300px; line-height: 10px; display: inline-block; } p:hover { background: #ffb315;/*鼠标渐变颜色*/ } p1 { border: 1px #041807 solid; /*边框-颜色*/ padding: 10px; /*声明内边框属性 可调距离*/ height: 8px; width: 3px; border-radius: 20px; margin: 0px auto; background-color: #FF0000; position: relative; top: 0px; right: 0px; } p2 { border: 1px #041807 solid; /*边框-颜色*/ padding: 10px; /*声明内边框属性 可调距离*/ height: 8px; width: 3px; border-radius: 50%; margin: 3px auto; background-color: #FF0000; position: relative; top: -70px; right: 420px; } p3 { border: 1px #041807 solid; /*边框-颜色*/ padding: 10px; /*声明内边框属性 可调距离*/ height: 8px; width: 3px; border-radius: 20px; margin: 3px auto; background-color: #FF0000; position: relative; top: -70px; right: 420px; } p4 { border: 1px #041807 solid; /*边框-颜色*/ padding: 10px; /*声明内边框属性 可调距离*/ height: 8px; width: 3px; border-radius: 20px; margin: 3px auto; background-color: #FF0000; position: relative; top: -70px; right: 420px; } h1{ } </style> </head> <body> <h1><img src="作业/focus.jpg"/></h1> <p> 1 </p> <p> 2 </p> <p> 3 </p> <p> 4 </p> <p>5</p> </body> </html>
第八章2
最新推荐文章于 2019-12-26 21:40:33 发布