高さ 100% 問題_html/css_WEB-ITnose-htmlチュートリアル-php.cn

ホームページ

ウェブフロントエンド

htmlチュートリアル

高さ 100% 問題_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

Jun 24, 2016 am 11:52 AM

ドキュメントモードを宣言した後、IE での次のコードの高さは 100% 無効になります。
1. ヘッダーでコメントされたメソッドを使用しないでください。
2. 指定された高さを使用しないでください。
何か良い方法はありますか？ヘルプ！

;html xmlns="http://www.w3.org/1999/xhtml">

無題ページ <br> >

< ;TABLE style="BORDER-COLLAPSE: 折りたたみ; HEIGHT:100%;">
;TD style="border-left:2px ソリッドレッド">
vAlign=middle>

。

html,body{height:100%;}

これを試してみましたが、うまくいきませんでした。

IE6
http://www.cnblogs.com/huangyong8585/archive/2013/02/05/2893058.html

html,body{height:100%;}

これ実験しましたが、役に立ちませんでした。

html,body{height:100%;}

これを試しましたが、うまくいきませんでした。

IE6

http://www.cnblogs.com/huangyong8585/archive/2013/02/05/2893058.html

2 番目の方法は機能しますが、質問したときに事前に述べました. は、指定された固定高さを採用せず、既存のコード構造を破壊することはできません (doctype 宣言を削除します)。

最初の方法は質問とは異なります。質問はテーブルであり、td は行をまたがっています。この方法を試してもうまくいきませんでした。

ああ、height:100% は必要ありません。この属性は親が高さを定義する場合にのみ有効です

の高さに応じて margin-top を記述します。コンテンツブロック:- コンテンツブロックの高さ 1/2

ああ、この属性は親が高さを定義する場合にのみ有効です
:50% にしてから、コンテンツブロックの高さに合わせて Write margin-top を使用します。 - コンテンツブロックの高さ 1/2

2 行目のコンテンツは可変であり、多くのコンテンツが存在します。このようなテーブル。実際、私が実現したい機能は非常に単純で、複数の TABLE の td に異なる色の 2 本の左境界線を追加することです。 1つだけあれば手間が省けます。

html,body{height:100%;}

html,body{height:100%;}

td:nth-child(odd){border-left:2px solid red}td:nth-child(even){border-left:2px solid blue}

<!DOCTYPE html><html><head><title>无标题页</title><style type="text/css">/*CSS3 nth-child() 选择器*/td:nth-child(odd){border-left:2px solid red}td:nth-child(even){border-left:2px solid blue}</style><script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script><script type="text/javascript">/*$(document).ready(function(){	$("#mytable").find("td").css("border-left", "2px solid red");	$("#mytable").find("td:odd").css("border-left", "2px solid blue");});*/</script></head><body><table id="mytable">  <tr>    <td> </td>    <td> </td>    <td> </td>	<td> </td>  </tr></table></body></html>

これは間違っています。そのため、上記のコードは 2 行にまたがる 1 つの列を使用しています。ヘッダーの部分を見てみましょう。スクリーンショットの効果は次のとおりです。

声明

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

公式アカウントのキャッシュの更新の難しさ：バージョンの更新後のユーザーエクスペリエンスに影響を与える古いキャッシュを回避する方法は？Mar 04, 2025 pm 12:32 PM

公式アカウントのWebページはキャッシュを更新します。これはシンプルでシンプルで、ポットを飲むのに十分な複雑です。あなたは公式のアカウントの記事を更新するために一生懸命働きましたが、ユーザーはまだ古いバージョンを開くことができますか？この記事では、この背後にあるtwist余曲折と、この問題を優雅に解決する方法を見てみましょう。それを読んだ後、さまざまなキャッシュの問題に簡単に対処でき、ユーザーが常に新鮮なコンテンツを体験できるようになります。最初に基本について話しましょう。それを率直に言うと、アクセス速度を向上させるために、ブラウザまたはサーバーはいくつかの静的リソース（写真、CSS、JSなど）やページコンテンツを保存します。次回アクセスするときは、もう一度ダウンロードすることなく、キャッシュから直接検索できます。自然に高速です。しかし、このことは両刃の剣でもあります。新しいバージョンはオンラインです、