私は、左端に透明なアクセントを持つタイトルバーを持っています。また、堅実な背景色もあります。私はそれが敏感でタイトルの長さを受け入れる必要があります。 IDKなぜこのような痛みですが、私はすべてを試しました。透明なアイコンと堅実な背景色を持つ反応タイトル
私はバックグラウンドとして静止画像を試しましたが、タイトルが2行高い場合はサイコロです。
ソリッドアイコンの場合は簡単です。イメージをドロップして背景色を追加するだけです。背景色を凌駕する「透明な画像」はないので、私は失われてしまいます。
単色の背景と透明性を兼ね備えする方法上の任意のアイデアを、背景が透明に記入言っていない?ここで
は、最終製品のように見えるために必要なものですか
更新:私の現在のコードはあまり良くありませんが、ここにあります。ほとんどの幅で十分に機能しますが、幅が狭くなると災害です。私はあなたの提案を試し、物事がどのようにうまくいくかを伝えます。みんな、ありがとう!!!
HTML
.titlebox-wrap {
width:90%;
position:absolute;
top:-2em;
left:-3em;
margin:0;
padding:0;
}
.titlebox-hook {
background: url("images/blue-cap.png") no-repeat;
background-size:cover;
background-position:left center;
position:absolute;
top:0;
left:0;
width:10%;
height:100%;
z-index:-1;
}
.titlebox-text {
background:#0d2240;
margin:0;
margin-left:9.8%;
padding:.7em 1em .7em 0;
max-width:80%;
float:left;
-webkit-border-radius:.2em 3em 3em .2em;
-moz-border-radius:.2em 3em 3em .2em;
border-radius:.2em 3em 3em .2em;
}
<div class="titlebox-wrap">
<div class="titlebox-hook"></div>
<span class="titlebox-text">THIS STUPID THING NEEDS TO DICTATE LENGTH</span>
</div>
コードを投稿すれば、そこから開始します。 – Cons7an7ine
が更新されました。見ていただきありがとうございます。 –