これが尋ねられた場合は、事前に申し訳ありません: 見つかりませんでしたが、使用したキーワードについてはよくわかりません。
とにかく!画像の上に不透明な白いグラデーション ラインを配置しようとしています。これは私がそれを上に置こうとしているものです:
div.horizontal
{
position: relative;
width: 100%;
height:45px;
}
div.horizontal ul
{
list-style-type:none;
margin:0;
padding:0;
}
div.horizontal li
{
float:left;
}
div.horizontal a
{
display:block;
width:312px;
height:35px;
background-image: url("../img/truefactzheader.png");
}
div.horizontal a:link,div.horizontal a:visited
{
font-weight:bold;
color:#FFFFFF;
text-align:center;
vertical-align:middle;
padding:4px;
text-decoration:none;
text-transform:uppercase;
}
div.horizontal a:hover,div.horizontal a:active
{
height:45px;
a:link {text-decoration:none;}
a:visited {text-decoration:none;}
}
グラデーションコードは次のとおりです。
background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.15) 51%, rgba(255,255,255,0.15) 52%, rgba(255,255,255,0) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0)), color-stop(51%,rgba(255,255,255,0.15)), color-stop(52%,rgba(255,255,255,0.15)), color-stop(100%,rgba(255,255,255,0)));
background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,0.15) 51%,rgba(255,255,255,0.15) 52%,rgba(255,255,255,0) 100%);
background: -o-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,0.15) 51%,rgba(255,255,255,0.15) 52%,rgba(255,255,255,0) 100%);
background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,0.15) 51%,rgba(255,255,255,0.15) 52%,rgba(255,255,255,0) 100%);
background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,0.15) 51%,rgba(255,255,255,0.15) 52%,rgba(255,255,255,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00ffffff',GradientType=0 );
どうすれば他のものを取得できますか?
編集:
私はこれを試しました:
background: url("../img/truefactzheader.png"), -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.15) 51%, rgba(255,255,255,0.15) 52%, rgba(255,255,255,0) 100%);
background: url("../img/truefactzheader.png"), -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0)), color-stop(51%,rgba(255,255,255,0.15)), color-stop(52%,rgba(255,255,255,0.15)), color-stop(100%,rgba(255,255,255,0)));
background: url("../img/truefactzheader.png"), -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,0.15) 51%,rgba(255,255,255,0.15) 52%,rgba(255,255,255,0) 100%);
background: url("../img/truefactzheader.png"), -o-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,0.15) 51%,rgba(255,255,255,0.15) 52%,rgba(255,255,255,0) 100%);
background: url("../img/truefactzheader.png"), -ms-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,0.15) 51%,rgba(255,255,255,0.15) 52%,rgba(255,255,255,0) 100%);
background: url("../img/truefactzheader.png"), (linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,0.15) 51%,rgba(255,255,255,0.15) 52%,rgba(255,255,255,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00ffffff',GradientType=0 );
しかし、それでもうまくいきませんでした