1

この回転バナーのコントロールの外観を変更したいと思います。現在、それらは単なるグレーです (現在/選択されているものは黒です)。ドットを灰色のアウトラインで白くしたい（そして選択した/現在のドットを灰色のアウトラインでオレンジ色にしたい）。

これがcssです（セレクターは.rslides_tabs aだと思います）：

.rslides_container
{
    position: relative;
}

.rslides
{
    position: relative;
    list-style: none;
    overflow: hidden;
    width: 100%;
    padding: 0;
    margin: 0;
}

    .rslides li
    {
        position: absolute;
        display: none;
        width: 100%;
        left: 0;
        top: 0;
    }

    .rslides li:first-child
    {
        position: relative;
        display: block;
        float: left;
    }

        .rslides img
        {
            display: block;
            height: auto;
            float: left;
            width: 100%;
            max-width:  100%;
            border: 0;
        }

    .rslides_tabs
    {
        margin-top: 10px;
        text-align: center;
    }

        .rslides_tabs li
        {
            display: inline;
            float: none;
            _float: left;
            *float: left;
            margin-right: 5px;
        }

            .rslides_tabs a
            {
                text-indent: -9999px;
                overflow: hidden;
                -webkit-border-radius: 15px;
                -moz-border-radius: 15px;
                border-radius: 15px;
                -webkit-background-clip: padding-box;
                background: #ccc;
                display: inline-block;
                _display: block;
                *display: block;
                -webkit-box-shadow: inset 0 0 2px 0 rgba(0,0,0,.3);
                -moz-box-shadow: inset 0 0 2px 0 rgba(0,0,0,.3);
                box-shadow: inset 0 0 2px 0 rgba(0,0,0,.3);
                width: 9px;
                height: 9px;
            }

            .rslides_tabs .rslides_here a
            {
                background: #222;
            }

    .rslides_nav
    {
        position: absolute;
        -webkit-tap-highlight-color: #000;
        top: 50%;
        left: 0;
        -webkit-opacity: 0.7;
        -moz-opacity: 0.7;
        -o-opacity: 0.7;
        filter: alpha(opacity=70);
        opacity: 0.7;
        text-indent: -9999px;
        overflow: hidden;
        text-decoration: none;
        height: 61px;
        width: 38px;
        background: transparent url( '../images/responsiveslides.gif' ) no-repeat left top;
        margin-top: -45px;
    }

    .rslides_nav:active,
    .rslides_nav:hover
    {
        -webkit-opacity: 1;
        -moz-opacity: 1;
        -o-opacity: 1;
        filter: alpha(opacity=100);
        opacity: 1;
    }

    .rslides_nav.next
    {
        left: auto;
        background-position: right top;
        right: 0;
    }

私を助けるためにさらにコードが必要な場合は、お知らせください。

4

2 に答える 2

2 
.rslides_tabs .rslides_here a

あなたが現在いる場所です

.rslides_tabs a

選択されていないドットの値があります。

backgroundプロパティを必要な色に変更します。

于 2012-12-10T14:30:24.687 に答える
2 
.rslides_tabs a {
  background-color:red;
  border: 1px solid grey;
//here goes your style
}

.rslides_tabs .rslides_here a {
  //here goes your style for the selected one
}
于 2012-12-10T14:32:54.870 に答える