1

このHTMLを検討してください。

<div id="entry-content">
    <div id="my-300px-ad">AD CODE HERE</div>
    <p><img src="file.jpg" alt="file" /></p>
    <p>SOME TEXT</p>
    <p>SOME MORE TEXT</p>
</div>

ここで、div#my-300px-adが右に浮いていると考えてください。次の段落の画像を広告の前に表示して、次の段落のテキストで広告を折り返すことはできますか？

たとえば、次のようになります。

例

なぜそうなのか...？

問題は、さまざまな理由（Googleを含む）のために、投稿のコンテンツの間に広告を配置することを避けたいということです。

CSSのみ

このようなことがJavaScriptコードで可能になると確信しています。しかし、私はCSSベースのソリューションのみを探しています。（クロスブラウザー互換性、≥IE8）

div#my-300px-ad変更できるのはのCSSのみであることに注意してください。これは静的なHTMLページではないため、記事である以外は何も触れないでください。

PS：これについて1行の質問を組み立てるのは困難でした。質問のタイトルをより明確にできる場合は、自由に編集してください。

4

1 に答える 1

1

これらの2つの質問で述べられているように、これは不可能です。

CSSを使用してDIVを並べ替えます

CSSレイアウト、CSSを使用してDIVを並べ替える

スキップする要素の高さを知らない場合、javascriptを使用する場合、またはhtmlを変更する場合は、説明した方法で要素をcssで並べ替えることはできません。

ただし、WordPressテーマを作成しているように見えるので、投稿内と画像の後に広告を配置するのはそれほど難しくありません。その場合、広告を脇の要素の中に配置すると、それがメインの投稿の一部ではないことをGoogleに知らせる必要があります。

Mozilla Developer Network： HTML4では、すべてのセクションがドキュメントのアウトラインの一部です。しかし、ドキュメントはそれほど直線的ではないことがよくあります。ドキュメントには、広告ブロックや説明ボックスなど、メインフローに関連しているものの、その一部ではない情報を含む特別なセクションを含めることができます。HTML5では、<aside>このようなセクションをメインアウトラインの一部にしないようにする要素が導入されています。

于 2012-06-09T04:17:25.357 に答える