スタイルの問題、pictures_html/css_WEB-ITnose 間の空白部分についてアドバイスを求めている新人
これが対象の効果です。
スタイルファイルを盗み、写真を盗み、全く同じソースコードをテストしてみた結果は以下の通りで、泣きました。
プロンプト ボックスのページ ソース コードは次のとおりです:
<table class="MessageBox" align="center" width="500"> <tr class="head"> <td class="left"></td> <td class="center"> <div class="title">提示</div> </td> <td class="right"></td> </tr> <tr class="msg"> <td class="left"></td> <td class="center info"> <div class="msg-content">请选择用户，只能查询您管理范围内的，角色序号在您之后的用户</div> </td> <td class="right"></td> </tr> <tr class="foot"> <td class="left"></td> <td class="center"></td> <td class="right"></td> </tr></table>
関連するスタイルは次のとおりです:
/* 提示框样式 */.MessageBox{}/* 表头 */.MessageBox .head{ height:32px; overflow:hidden;}.MessageBox .head .left{ width:20px; background:url('images/message_bg.png') left 0px no-repeat;}.MessageBox .head .center{ padding:0px; background:url('images/message_bg.png') 0px -32px repeat-x;}.MessageBox .head .center .title{ float:left; color:#fff; font-size:16px; font-weight:bold; margin-top:5px;}.MessageBox .head .right{ width:20px; background:url('images/message_bg.png') right 0px no-repeat;}/* 表头 */.MessageBox .head-no-title{ height:16px;}.MessageBox .head-no-title .left{ width:20px; background:url('images/message_bg.png') left -96px no-repeat;}.MessageBox .head-no-title .center{ background:url('images/message_bg.png') 0px -112px repeat-x;}.MessageBox .head-no-title .right{ width:20px; background:url('images/message_bg.png') right -96px no-repeat;}/* 按钮栏 */.MessageBox .control{ height:40px; vertical-align:top;}.MessageBox .control .left{ width:20px; background:url('images/message_center_bg.png') left top repeat-y;}.MessageBox .control .center{ background-color:#7bafe6; text-align:center;}.MessageBox .control .right{ width:20px; background:url('images/message_center_bg.png') right top repeat-y;}/* 表底 */.MessageBox .foot{ height:16px;}.MessageBox .foot .left{ width:20px; background:url('images/message_bg.png') left -64px no-repeat;}.MessageBox .foot .center{ background:url('images/message_bg.png') 0px -80px repeat-x;}.MessageBox .foot .right{ width:20px; background:url('images/message_bg.png') right -64px no-repeat;}/* 提示框 */.MessageBox .msg{ height:90px;}.MessageBox .msg .left{ width:20px; background:url('images/message_center_bg.png') left top repeat-y;}.MessageBox .msg .center{ padding-left:90px; font-size:16px; background-color:#7bafe6;}.MessageBox .msg .center .msg-content{ color:#fff; margin:20px 12px 20px 6px;}.MessageBox .msg .right{ width:20px; background:url('images/message_center_bg.png') right top repeat-y;}.MessageBox .msg .error{ background-image:url("images/icon64_error.png"); background-position:0px 10px; background-repeat:no-repeat;}.MessageBox .msg .info{ background-image:url("images/icon64_info.png"); background-position:0px 10px; background-repeat:no-repeat;}.MessageBox .msg .warning{ background-image:url("images/icon64_warning.png"); background-position:0px 10px; background-repeat:no-repeat;}.MessageBox .msg .forbidden{ background-image:url("images/icon64_forbidden.png"); background-position:0px 10px; background-repeat:no-repeat;}.MessageBox .msg .stop{ background-image:url("images/icon64_stop.png"); background-position:0px 10px; background-repeat:no-repeat;}.MessageBox .msg .blank{ height:40px; padding:10px 20px 10px 20px; text-align:center;}必要な画像は次のとおりです:
これは message_bg.png です
これは message_center_bg.png です
助けてください~ 明日、デモンストレーションのための会議があります。私は .NET 開発者ですが、スタイルについては全くの素人です。 。
これは HTML 標準に関連しているようです:
皆さんありがとうございます~
ディスカッション (解決策) に返信することができます。デバッグして、どの背景がズレているかを確認します。以下は、xy 座標を変更して、デモンストレーション用であれば、なぜそんなに多くのスプライシングを行うのでしょうか。多くの種類のメソッドを表示したいですか?
テーブルのセルスペース cellpadding を 0 に設定します
スペルが間違っている可能性があります
テーブルの境界線、マージン、スペースを 0 に設定します:
