課題:情報処理実習3B(Web)

課題

09.css_display/float.html

表示

作成例
元ファイル

ソース


<!DOCTYPE html>
<html lang="ja">
<head>
   <meta charset="UTF-8" />
   <title>回り込み</title>
</head>
<style>
.a{
    width:10em;height:3em;background:#dcdcdc;border:3px black solid;
}

.b{
    width:2em;height:5em;background:#c0c0c0;border:3px black solid;
}

.c{
    width:12em;height:2em;background:#808080;border:3px black solid;
}

.d{
    width:3em;height:4em;background:#696969;color:#FFFFFF;border:3px black solid;
}

.e{
    width:15em;height:2em;background:#000000;color:#FFFFFF;border:3px black solid;
}
</style>
<body>
<h1>回り込み</h1>
<article>
<h2>基本問題</h2>
<figure>
<div class="a" style="">A</div>
<div class="b" style="">B</div>
<div class="c" style="">C</div>
<div class="d" style="">D</div>
<div class="e" style="">E</div>
</figure>
</article>
</body>
</html>