0

私は助けが必要です。1) 製品画像、png は、製品ページでは透明ではありませんが、単一の製品ページにあります。また、積み上げられた製品レイアウトでは問題ありませんが、グリッドでは問題ありません。そしてグリッドレイアウトが必要です。テーマ設定でグリッドまたはスタック レイアウトを選択できます。(Nova テーマ) 2) flexslider についても。これは私たちにとっても重要です。なぜなら、私たちはさまざまなフレームで遊びたいので、その透明性が必要だからです..私はこれを調査するのに何日も費やしましたが、解決策が見つかりませんでした.私の頭はいっぱいで混乱しています. 手伝ってくれますか？

4

2 に答える 2

0

HTML は次のとおりです。

<section class="product_images">
    <img src="http://images.cdn.bigcartel.com/bigcartel/product_images/141424843/max_h-300+max_w-300/traka2.png" class="fade_in" alt="Image of yellow melon. mellow">
</section>

タグには<section>、クラスを介して背景色が適用されproduct_imageます。そのクラスの CSS は次のとおりです。

#products_page .canvas.grid #products .product a .product_images {
    width: 100%;
    min-height: 100%;
    margin: 0;
    background: transparent;
    background: #efefef;
}

この CSS セレクターは に表示されline 1471ますtheme.css。2 番目の背景宣言を削除するbackground: #efefef;と、表示される色が消えます。CSS では、ルールが後で同じ特異性で繰り返される場合、オーバーライドされます。CSS、カスケード、特異性などの詳細については、こちらのリンクを参照してください。

<img>要素は、要素の上にあると考えてください<section>。画像の一部は窓のように透明なので、「下」にあるものはすべて透けて見えます。あなたの<section>要素には、PNGの透明度を通して表示されていた明るい灰色の背景色がありました。

于 2014-08-05T20:20:51.343 に答える
0

Big Cartel のシステムでこれを行う最善の方法は、[デザインのカスタマイズ] > [詳細設定] > [CSS] に移動し、これを一番下に貼り付けることです。

#products_page .canvas.grid #products .product a .product_images { 
    background:none; 
}

そうすれば、エディターでコード行を探して変更する必要がなくなり、途中で気が変わった場合でも、これらの 3 行をすばやく簡単に削除できます。

于 2014-08-05T23:46:54.837 に答える