3

だから私は男のためにウェブサイトを構築しています. そこで私は、ページを独自のボックスにロードする単純な iFrame をまとめました。すべてが適切に機能しますが、彼は見た目が好きではありません。ページ全体に表示され、センタリングの問題が発生します。

だから私はそれを独自のdivに入れ、jQuery経由でページをdivにロードするだけだと思ったが、 stylesheets で問題が発生する. ロケーションページとロードされた計算機ページの両方に、使用する必要がある必須の CSS 要素があり、それらは互いに競合します。そのため、ロードされたページで div 内にある css インポートをその div 内の要素にのみ適用する方法はありますか?すべての名前を変更せずに？

ご協力いただきありがとうございます。

コード：

function po()
{
    $("#calculator").load("/calculator/");
    $("#calculator").fadeIn();
    $("#modalbackground").fadeIn();
    $("#closeCalc").fadeIn();
}

他の解決策は喜んで受け入れられます！

4

4 に答える 4

2

たぶん、境界線のない iframe を div に入れることができます

<div style='width:100px; height:100px;'>
    <iframe style='width:100%; height:100%; border:0;'></iframe>
</div>

iframe は div の幅全体を取る必要があります

于 2012-11-15T18:53:41.830 に答える
0

bodyタグを含め、div内のページ全体をロードする場合、これは間違いなく間違っています。代わりに、ページフラグメント（計算機ページ内の特定のdiv）をロードする必要があります。この場合、競合を回避するために、この特定のdivに一意のIDを指定し、このIDに基づいてインポートされたスタイルシートを作成します。

#loginBox input {...}

これが不可能な場合は、iframeが最適な方法だと思います。たとえば、計算機内に、親のサイズを変更するスクリプトを追加できます（parent.frameElementを介してアクセスします）。ちなみに、html5には「シームレス」属性がありますが、現時点ではブラウザの互換性はまだ不十分です。

于 2012-11-15T19:11:55.140 に答える
0

タグに追加frameborder="0"する<iframe>だけで、スクロール可能な のように見えます<div>。CSS で独自の境界線を追加することもできます (ただし、それは、それ自体ではなく、含まれている要素に対して行う方がよいでしょう<iframe>)。

<iframe>必要に応じて、 に似た を使用している私の Web サイトのスクリーンショットをお見せします<div>。

于 2012-11-15T18:54:40.653 に答える
0

Mozilla で iframe を正常に動作させるには、単位として px の代わりに em を使用するか、あなたの場合のように div 制限を超える場合は通常の % を使用する必要があります。

この質問はいくつかの FireFox フォーラムで尋ねられましたが、iframe の使用に関してセキュリティ上の懸念があるようです。

em 値は div タグではなく iframe タグで指定する必要があります

上下に 3 つの iframe があるページを作成しました (ほとんどの人は気に入らないと思いますが、私は初心者です)。すべてのブラウザーで完全に正常に動作します。

実際に自分で試して em を決定できる必要があります。

個人的には、回避策として iframe を使用することはお勧めしませんが、設計どおりに使用する必要があります。

これが私の投稿を読んでいるすべての人に役立つことを願っています。私が間違っていると思われる場合は、コメントを残してください。よろしくお願いします。ありがとうございました！

于 2015-08-19T15:54:40.190 に答える