2017-11-14 15 views
-2

HTMLでは、divタグをキャンバスなどのコンテンツの後に使用すると、divコンテンツがキャンバスになります。そのコンテンツを右側に配置するタグはありますか? 、この最初のものは、CSSのfloat型プロパティを使用している2つ目は、ブートストラップである達成するための2つの方法がありますコンテンツをグループ化するHTMLタグ

enter image description here

+0

使用CSS 'float'性 –

+0

ブロックとインライン要素の違いを見るhttps://developer.mozilla.org/en-US/docs/Web/HTML/Inline_elements –

答えて

1

下の画像をご覧ください。あなたの理解を深めるためのデモコードを追加します。

<!DOCTYPE html> 
 
    <html> 
 
    <head> 
 
    <style> 
 
    div.container { 
 
     width: 100%; 
 
     border: 1px solid gray; 
 
    } 
 
    
 
    header, footer { 
 
     padding: 1em; 
 
     \t border-top: 1px solid black; 
 
     clear: left; 
 
    } 
 
    
 
    nav { 
 
     float: left; 
 
     max-width: 160px; 
 
     margin: 0; 
 
     padding: 1em; 
 
    } 
 
    
 
    nav ul { 
 
     list-style-type: none; 
 
     padding: 0; 
 
    } 
 
     
 
    nav ul a { 
 
     text-decoration: none; 
 
    } 
 
    
 
    article { 
 
     margin-left: 170px; 
 
     border-left: 1px solid gray; 
 
     
 
     overflow: hidden; 
 
    } 
 
    </style> 
 
    </head> 
 
    <body> 
 
    <div class="container"> 
 
    <nav> 
 
     <p>roundel container</p> 
 
    </nav> 
 
    <article> 
 
     <p>article body</p> 
 
    </article> 
 
    </div> 
 
    </body> 
 
    </html>

関連する問題