Question

嘿，伙计们！我正在尝试实施Easy Slider jQuery Plugin版本1.7并遇到一些问题。在这个demo页面中，您可以看到幻灯片下方的编号按钮，我试图将其与幻灯片居中，但无法使其正常工作。

这是编号按钮的默认css，并想知道我必须更改它以使其在页面中居中。

    /* numeric controls */  

ol#controls{
    margin:1em 0;
    padding:0;
    height:28px;    
    }
ol#controls li{
    margin:0 10px 0 0; 
    padding:0;
    float:left;
    list-style:none;
    height:28px;
    line-height:28px;
    }
ol#controls li a{
    float:left;
    height:28px;
    line-height:28px;
    border:1px solid #ccc;
    background:#DAF3F8;
    color:#555;
    padding:0 10px;
    text-decoration:none;
    }
ol#controls li.current a{
    background:#5DC9E1;
    color:#fff;
    }
ol#controls li a:focus, #prevBtn a:focus, #nextBtn a:focus{outline:none;}

/ * // Easy Slider * /

感谢您的帮助！

Answer 1

只需设置

  text-align:center;

在父元素上。

编辑：添加以下（正确的宽度，我没有检查）到ol＃controls style def：

    width:250px;
    text-align:center;
    margin-left:auto;
    margin-right:auto;

Easy Slider jQuery插件使用CSS中心数字按钮

1 个答案: