1

このようにスライダーの周りに白い境界線を配置したい>> ここに画像の説明を入力してください

を使ってみ.coin-slider img { border: 2px solid white;}ましたが、うまくいきませんでした。

コインスライダーリンク>>コインスライダー公式サイト

HTML:

<div id='coin-slider'>

                     <img src='images/slideshow1x.png' />
                            <span>
                                Description for img01
                            </span>



                     <img src='images/slideshow2x.jpg' />
                            <span>
                                Description for img01
                            </span>



                     <img src='images/slideshow3x.jpg' />
                            <span>
                                Description for img01
                            </span>



                     <img src='images/slideshow4x.jpg' />
                            <span>
                                Description for img01
                            </span>

</div>

CSS:

.coin-slider { overflow: hidden; zoom: 1; position: relative; }
.coin-slider img { border: 2px solid white;}
/*.coin-slider a{ text-decoration: none; outline: none; border: none; } */

.cs-buttons { font-size: 0px; padding: 10px; float: left; }
/*.cs-buttons a { margin-left: 5px; height: 10px; width: 10px; float: left; border: 1px solid #B8C4CF; color: #B8C4CF; text-indent: -1000px; }*/
.cs-active { background-color: #B8C4CF; color: #FFFFFF;}

.cs-title { width: 545px; padding: 10px; background-color: #000000; color: #FFFFFF; }

.cs-prev, 
.cs-next { background-color: #000000; color: #FFFFFF; padding: 0px 10px; }
4

2 に答える 2

2

HTML ではcoin-sliderは でidあり、 ではdivありませんclassが、CSS では.coin-sliderあらゆる場所を参照しています。

HTML を に変更<div id='coin-slider'>する<div class='coin-slider'>と、すべて正常に動作するはずです。

これがデモです。

于 2012-08-07T01:39:06.773 に答える
0

コインスライダーの白枠はスタイル追加で設定可能

border: 2px solid white;

Cascading Stylesheet 'coin-slider-style.css' に

.coin-slider {overflow:hidden; zoom:1; position:relative; border:2px solid white;}
于 2015-10-12T10:17:59.053 に答える