CSS修改实例之搭建像chinaz的超级ping一样的样式

我们测试IP的ping的时候常常会使用chinaz作为我们的ping,但是我们很少会发现当我们直接复制chinaz的时候就会出现那个难看的带圆点li列表(如果你的主题没有定义li的话)那么怎么解决呢?看阿福变魔术吧

只要在你的wordpress的主CSS上加上以下的CSS代码,直接复制之后效果就在下面了,是不是很轻松呢?

/* ping列表开始 */
#detail {margin:5px auto;width:600px;border:#b2b2b2 1px solid;overflow:hidden;font-size:13px;font-family:”Microsoft Yahei”;}
#detail ul {margin:0 !important;padding:0 !important;height:35px !important; width:666px !important; overflow:hidden !important;border-bottom:#b2b2b2 1px dotted !important;}
#detail ul:hover{background:#f4f4f4 !important;}
#detail li{ text-align:center !important;padding-top:8px !important;margin-left:0px !important;color:#555 !important;height:34px !important;width:128px !important; float:left !important; list-style:none !important; }
#detail #detail ,#detail .head:hover {background:#f4f4f4 !important;}
#countresult{margin:20px auto;font-size:13px;font-family:”Microsoft Yahei”;text-align:center;color:#555;}

/* ping列表结束 */

效果如下:

  • 序号
  • Ping的地点
  • 响应IP
  • 响应时间
  • TTL
  • 赞助商 赞助点联系QQ:1751691323
最快:上海[电信] 5 毫秒    最慢:德国[海外] 299 毫秒
电信平均: 28 毫秒    联通平均: 45 毫秒

CSS修改实例之搭建像chinaz的超级ping一样的样式》上有34条评论

    1. 阿福 文章作者

      看看我的主机介绍博客就知道是干啥了。。。直接复制chinaz的到自己的博客,然后啥都不用修改就OK了。

      回复

发表评论

电子邮件地址不会被公开。 必填项已用*标注

嗯,想看到验证码,你得开javascript