Webページを設計するとき、私たちは常にいくつかの不快なことに遭遇します。最も一般的なのは、バックグラウンドにコンテンツを追加した後、表示されたページが開いていることがわかることです。これにより、Webページが非常に見苦しいものになります。過去には、人々は基本的にテーブルを設計していたため、自然にオンラインで多くのソリューションがあります。現在、Div CSS標準設計があり、関連する良い方法はめったにありません。 Xiaoxiang Onlineは、テーブルが広がってあなたと共有するのを防ぐために、日常生活に見られる良い方法を要約しています。
1.たとえば、コードなど、Webページに画像サイズを直接設定します。これにより画像サイズが制限される可能性がありますが、画像をアップロードする前に画像サイズを手動で変更する必要があります。そうしないと、アップロードされた画像が変形します。
2。次のコードを使用します。<img src = http://www.cuoxin.com/images/cuoxincom.jpg onload = javascript:if(this.width> 600} {this.style.width = 600;}>
この方法は、画像を呼び出すときに指定された幅に自動的に収縮します。これにより、画像が変形されず、テーブルが壊れません。ただし、不利な点は、画像が大きすぎる場合、画像のダウンロードプロセス中、つまり画像表示プロセス中に、最初に画像のサイズに表示され、テーブルが壊れ、ページがugいですということです。第二に、画像が完全に表示されると、画像は自動的に収縮します。
3.たとえば、テーブルのサイズを制限して、テーブルが伸びるのを防ぐことができます。たとえば、<table width = 600 border = 0 cellpadding = 0 cellpadding = 0> style = table-layout:fixed; word-word; break-break; break-all;、table-layout:sixed;テーブルレイアウトを修正することです。これにより、テーブルが伸びるのを効果的に防ぐことができます。ワードラップ:ブレークワード;ラインブレーク、つまりラインブレイクを強制することです。これは、多くのテキストコンテンツがある場合に使用する必要があります。並外れた複製コンテンツが表示され、ラインブレークが実行されない場合、テーブルは伸びます。と単語の壊れ:ブレイクオール; IEフレームワークが英語(アジア以外のテキストライン)によって分散されるという問題を解決できますが、ラインラップを強制せず、テーブル幅のコンテンツのみが表示されます。一般的に言えば、style = table-layout:fixed; word-wrap:break-wordを使用するだけです。もちろん、上記の声明は、たとえばCSSで定義できます。
| テーブル { Table-layout:修正; ワードラップ:ブレークワード; } |
4. CSSを使用して、画像の適応サイズを制御します。コードは次のとおりです。
| img { 最大幅:600px; 幅:式(this.width> 600?600px:this.width); オーバーフロー:隠し; } |
その中で、最大幅:600px; IE7やFirefoxなどの他の非IEブラウザーでは、最大幅は600pxですが、IE6では無効です。幅:600px;すべてのブラウザで、画像のサイズは600pxです。画像サイズが600pxを超えると、IE6で有効な600pxに自動的に収縮します。そしてオーバーフロー:隠された;画像サイズを制御できないため、テーブルの変形を避けるために、設定サイズを超えて部分を隠すことを指します。 2ページの前のページ12次のページ次のページ