理解できない効果があります。専門家にアドバイスを求めてください_html/css

理解できない効果があります。専門家にアドバイスを求めてください_html/css_WEB-ITnose

WBOY

リリース： 2016-06-21 09:38:20

オリジナル

813 人が閲覧しました

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html> <head>  <title> New Document </title>  <meta name="Generator" content="EditPlus">  <meta name="Author" content="">  <meta name="Keywords" content="">  <meta name="Description" content="">  <style>ul li{   background: url("images/navbar.png") no-repeat scroll 100% 50% transparent;   float: left;   list-style: none outside none;   margin: 0 -1px 0 1px;}ul li a{   color: #C8DBE4;   text-decoration: none;   padding: 0px 10px;}ul li a:hover{   color: #FFFFFF;}  </style> </head> <body style="background-color: blue;"><ul><li><a href="index.php"><span>首页</span></a></li><li><a href="#"><span>注册</span></a></li><li><a href="#"><span>登录</span></a></li><li><a href="#"><span>帮助</span></a></li></ul> </body></html>

ログイン後にコピー

これはコード内の navbar.png 画像です

ここでの点線の効果はどのようにして実現されるのでしょうか? navbar.png画像を削除すると点線が消えてしまうのですがなぜでしょうか？

ディスカッションへの返信（解決策）

わからないことはありません。このウェブサイトの写真には縦線の白い点があり、背景画像の位置によってその背景に変わります

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html> <head>  <title> New Document </title>  <meta name="Generator" content="EditPlus">  <meta name="Author" content="">  <meta name="Keywords" content="">  <meta name="Description" content="">  <style>ul li{   background: url("images/navbar.png") no-repeat scroll 100% 50% transparent;   float: left;   list-style: none outside none;   margin: 0 -1px 0 1px;}ul li a{   color: #C8DBE4;   text-decoration: none;   padding: 0px 10px;}ul li a:hover{   color: #FFFFFF;}  </style> </head> <body style="background-color: blue;"><ul><li><a href="index.php"><span>首页</span></a></li><li><a href="#"><span>注册</span></a></li><li><a href="#"><span>登录</span></a></li><li><a href="#"><span>帮助</span></a></li></ul><img src="images/navbar.png"/><!--增加图片就看到竖线了--> </body></html>

ログイン後にコピー

png は透明な背景をサポートしています。
信じられない場合は、簡単な実験を行ってください。背景が透明な新しい PHOTOSHOP ドキュメントを作成し、白で線を描き、PNG 画像として保存します。 ACDSEEで開くと画像が真っ白になってしまいますか？ただし、background: url("images/navbar.png") no-repeatscroll 100% 50% traditional; に設定すると、白い線は空白ではなく白い線のままになります。

写真のスタイルが見えません。コンピューターの問題なのか、正しく投稿されていないのかわかりません~~

写真がなくてもホワイトポイントを実行できますよね?久しぶりに投稿した写真の右側に4本の縦線があります白い点の列をよく見てください

ダウンロードして開いて拡大し、一番右の背景として使用してください真ん中

写真を削除しました、もちろん「破線」は消えています

皆さんありがとうございます