背景画像のオーバーレイの問題。ガイダンスを教えてください_html/css_WEB-ITnose

質問: 一番外側の div に大きな背景画像 (A) があり、この div のテーブルの下に入力があります。これはログイン ボタンです。ログイン ボタンにも背景画像があります。 (B)、この背景画像 B は長方形ではなく、角が丸くなっています。アーティストは角が丸いので、自分で調整するように言われました。しかし、幅と高さを設定した後、角が丸くなりません。透明ですが、表示されます 背景の色が白なのですが、白い角を消したいのですが、角を透明にする方法を教えてください。

追記: 画像 b は長方形ではなく、角が丸い画像です。幅と高さを設定した後、画像の塗りつぶされていない部分は背景色になり、透明になります。つまり、画像Aの背景色が表示されます。

<div id="login-bg" class="login-cultural-lib" >	<div class="sub-login">		<table cellspacing="0" cellpadding="0" border="0">			<tr>		    	<td width="220"><input name="name" id="name" type="text" maxlength="32"  class="name"  tabindex="1"></td>		    	<td rowspan="3" width="98">				     <input id='loginBtn' type="button"  value='登录' class="login-btn" tabindex="4">		    	</td>				......				.....			</tr>									</table>	</div></div>

.login-cultural-lib { 	cursor: default;        text-align:left; 	width:899px; 	height:507px; 	background: url(../images/login/login-bg-culturallib.png);}.login-btn {    width: 98px;    height: 98px;    background-image: url(../images/login/login-btn.png);    cursor: pointer;    border: 0px}

欲しい効果:



実際の効果:

ディスカッションへの返信 (解決策)

< 🎜 ＞このように書いても問題ありません、画像の角が丸くなっているか、透明になっているかを確認してください。

それでは文句を言いたいのですが、アートが完成するとこんな感じになるんですか～アートが水っぽすぎます～

質問: 大きな背景画像 (A) が配置されています。外側のレイヤー div のテーブルの下に入力があり、これがログイン ボタンです。このログイン ボタンにも背景画像があります (B)。この背景画像 B は長方形ではなく、角が丸くなっています。アーティストが角丸について教えてくれたので、自分で調整させていただきますが、幅と高さを設定した後、角丸は透明ではなく、白い背景を削除したいと思います。エッジの作り方を教えてください 角の部分を透明にします。

追記: 画像 B は長方形ではなく、角が丸い画像です。幅と高さを設定した後、画像の塗りつぶされていない部分は背景色になり、透明になります。つまり、画像Aの背景色が表示されます。

<div id="login-bg" class="login-cultural-lib" >	<div class="sub-login">		<table cellspacing="0" cellpadding="0" border="0">			<tr>		    	<td width="220"><input name="name" id="name" type="text" maxlength="32"  class="name"  tabindex="1"></td>		    	<td rowspan="3" width="98">				     <input id='loginBtn' type="button"  value='登录' class="login-btn" tabindex="4">		    	</td>				......				.....			</tr>									</table>	</div></div>

.login-cultural-lib { 	cursor: default;        text-align:left; 	width:899px; 	height:507px; 	background: url(../images/login/login-bg-culturallib.png);}.login-btn {    width: 98px;    height: 98px;    background-image: url(../images/login/login-btn.png);    cursor: pointer;    border: 0px}

欲しい効果:



実際の効果:

質問: 一番外側の div に大きな背景画像 (A) があり、この div のテーブルの下に入力があります。これがログイン ボタンです。ボタン 背景画像 (B) もあります。この背景画像 B は長方形ではなく、角が丸くなっています。ただし、幅と角を設定した後、アーティストは角が丸いと私に言いました。高さ、角の丸いパーツが透明ではないのですが、白い角を消したいのですが、角を透明にする方法を教えてください。

追記: 画像 b は長方形ではなく、角が丸い画像です。幅と高さを設定した後、画像の塗りつぶされていない部分は背景色になり、透明になります。つまり、画像Aの背景色が表示されます。

<div id="login-bg" class="login-cultural-lib" >	<div class="sub-login">		<table cellspacing="0" cellpadding="0" border="0">			<tr>		    	<td width="220"><input name="name" id="name" type="text" maxlength="32"  class="name"  tabindex="1"></td>		    	<td rowspan="3" width="98">				     <input id='loginBtn' type="button"  value='登录' class="login-btn" tabindex="4">		    	</td>				......				.....			</tr>									</table>	</div></div>

.login-cultural-lib { 	cursor: default;        text-align:left; 	width:899px; 	height:507px; 	background: url(../images/login/login-bg-culturallib.png);}.login-btn {    width: 98px;    height: 98px;    background-image: url(../images/login/login-btn.png);    cursor: pointer;    border: 0px}

欲しい効果:



実際の効果:

アーティストが作成したエフェクトは問題ありませんが、写真を切り取って配置すると、このようになります。ログインで幅と高さを設定します。 -btn クラスはありませんが、塗りつぶされた部分が不透明です。透明度とか設定する必要があるのでしょうか？ 設定してもダメなら再度ビューティーさんにカットしてもらうしかありません
透明度の問題ではありません。 . この写真をよく確認して、白い部分が同じかどうかを確認するように言いました〜

この写真をよく確認してくださいと言いました。白い部分が透明なのか白いのか見てみてください〜

透明です。 。 。

この写真の白い部分が透明なのか白いのかよく見てくださいって言いましたよ〜

透明です。 。 。 。
本当に透明な場合は、その親要素に背景色が設定されているかどうかを確認する必要があります。ボタンのスタイルに問題はありません。
透明画像を使用しない場合は、PNG 画像が jpg 画像よりも大きくなるため、ユーザーの読み込みが遅くなる可能性があります。

この写真の白い部分が透明なのか白いのかよく見てくださいって言いましたよ〜

は透明です。 。 。
本当に透明な場合は、その親要素に背景色が設定されているかどうかを確認する必要があります。ボタンのスタイルに問題はありません。
もう 1 つ無料のヒントを提供します。透明な画像を使用しない場合は、PNG 画像が jpg 画像よりも大きくなるため、ユーザーの読み込みが遅くなります。
しかし、input 要素を削除するだけでは背景色がなくなり、追加すると白い角が表示されて非常にイライラします。

それが機能しない場合は、ボタン コントロールを使用してみてはいかがでしょうか。画像を使用して画像にクリック イベントを追加します。

これがデフォルトのスタイルです。ブラウザに入力して書き換えるスタイルがいいですね。または、上記のような他のラベルを使用します。

これはブラウザーのデフォルトの入力スタイルです。スタイルを書き換えるだけです。または、上記のような他のラベルを使用します。
thx~~thx~~ 解決しました。背景色: 透明な属性を追加するだけです。デフォルトの入力スタイルであることがわかりました。熱心な回答をありがとうございました、ありがとう