0

素敵な無料の tumblr テーマを見つけて、限られた知識を使って背景を変更しましたが、テーマを作成した人はテーマのアイコンやアセットを透明にしませんでした。それらのほとんどはフォトショップで修正できましたが、うまくいかないように見えるものがあります. 関連すると思われるすべてのコードは次のとおりです。

.link .container { padding: 0 0 0 240px; }
    .link .link-wrap { position: relative; width: 590px; min-height: 90px; }
    .link .hand { position: absolute; top: 0; right: 0; width: 165px; height: 90px; background: {color:Accent} url("http://static.tumblr.com/gpln05e/BgCdi9xSQ/link-hand.png") no-repeat 100% 0; }
    .link h2 { font-size: 200%; margin-right: 165px; background: {color:Accent} url("http://static.tumblr.com/gpln05e/F8chS9xSQ/link-top.png") no-repeat 0 0; }
    .link h2 span { display: block; padding: 35px 0 20px 20px; background: transparent url("http://static.tumblr.com/gpln05e/5GBYS9xSQ/link-bot.png") no-repeat 0 100%; }
    .link h2 a:link, .link h2 a:visited { color: #fff; }
    .link h2 a:hover, .link h2 a:active { text-decoration: none; border-bottom: 1px dotted #fff; }
    .link .content { padding: 0 260px 0 20px; margin-top: 10px; }
    .link .meta { top: 35px; }

必要な画像をコードから直接リッピングし、必要な部分を透明にしましたが、うまくいかないようです。

問題

私が問題だと思うのは、あなたが見るフクシアの部分が実際には画像の透明な部分であり、コードの別の部分があなたがアクセントカラーとして設定したものであることを伝えているということです。

    <meta name="color:Accent" content="#ee3322" />

その場合、コードを変更して、特定の不透明な色をアクセントの色に変更する方法が必要です。そうすれば、不要なすべての黒を透明にすることができます。

上記で十分でない場合は、完全なコードのペーストビンへのリンクを次に示します。

完全なコードのペーストビン

4

1 に答える 1