0

コードは次のとおりです。

<!DOCTYPE html>
<html>
<head>
    <title>Html Basics</title>
</head>
<body>
    <header style="background-color:lightcoral">
        <img src="C:\Users\Public\Pictures\Sample Pictures\Koala.jpg" width="50px" height="50px"/>
        <nav>
            <ul>
                <li>One</li>
                <li>Two</li>
                <li>Three</li>
                <li>Go!!!</li>
            </ul>
        </nav>
    </header>
    <section>
        <article style="background-color:aqua">Article 1</article>
        <article style="background-color:grey">Article 2</article>
    </section>
    <aside style="background-color:palegreen">Aside</aside>
    <footer style="background-color:aliceblue">Footer</footer>
</body>
</html>

Chorme Browser バージョン 25.0.1364.152 m では、aside タグのような HTML 5 の効果が見られません。

4

1 に答える 1

0

タグは、配置されているコンテンツ以外のコンテンツを定義します。

脇のコンテンツは、周囲のコンテンツに関連している必要があります。

以下のコードを参照してください。

<!DOCTYPE html>
<html>
<head>
    <title>Lorem</title>
</head>
<body>
<div style="font:Arial, Helvetica, Sans-Serif;width:50%;">
<aside style="font-size:larger;font-style:italic;color:green;float:right;width:35%;padding:15px;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</aside>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce nec arcu sit amet orci sodales adipiscing. Proin imperdiet accumsan ipsum a eleifend. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed diam dolor, scelerisque a dictum id, tempor non est. Nam sit amet congue diam. Curabitur vel nunc nisl. Fusce vel sollicitudin dui. Morbi faucibus, eros vel 
</div>

</body>
</html>
于 2013-03-13T15:01:37.123 に答える