0

もっと調べて学べるように、適切な用語を見つけようとしています。このタブに遭遇しました。青い線の見出しをクリックすると、ポインターがポップアップしてタブのコンテンツを指します... (たとえば、[書籍] をクリックしてから [記事] などをクリックすると.例..

http://www.sutherlandlibrary.com/tabs/library-tabs-v4.htm

どうやってそれを作成できるか知りたいです。またはそれは何ですか？だから私はそれについて研究を始めることができます。

事前に感謝します。最初に検索する必要があることはわかっていますが、どこから始めればよいかわかりません。

乾杯

4

3 に答える 3

0

デモ: http://jsfiddle.net/trevordixon/hvBpF/

各タブは で<li>、現在選択されているタブにはクラスがありcurrentます。次の CSS ルールがあることがわかります。

.tab-features .tabs-list .current {
    background: url("images/feature-tab-arrow.gif") no-repeat center 27px;
}

したがって、currentクラスを持つタブには、タブの下部のすぐ下に配置された高さ 27 ピクセルの矢印イメージがあります。背景画像を使用する代わりに、次のようなこともできます。

.tab-features .tabs-list .current:after {
    content: "";
    width: 0;
    height: 0;
    /* These borders make it a triangle */
    border-left: 14px solid transparent;
    border-top: 14px solid #0088aa;
    border-right: 14px solid transparent;
}

したがって、このようなものを実装するには、適切なタブ スクリプトまたはプラグインを見つけて、現在選択されているタブをそのようにスタイルします。

于 2013-08-14T03:24:52.133 に答える