CSS : floatをあらためて学習
CSSの float は左右の配置と回り込みを指定します
回り込みとは？
画像と文章のHTMLです
使っている画像は高さ・横600pxです
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>float:回り込み</title>
</head>
<body>
<p>
<img src = "daruma600.png" alt = "ダルマのイラスト">
私の小学校のあだ名はダルマちゃんです。カワイイあだなで気に入っています。サッカーをしている時にかおりちゃんというお友達が付けた名前です。
</p>
</body>
</html>
文字は画像の下に表示されています
float:left; をCSSに書いてみる
@charset "utf-8";
img{
float:left;
}
画像が文字の左側にきました
２．float:right; をCSSに書いてみる
@charset "utf-8";
img{
float:right;
}
画像が右側にきました
この方の記事を参考にあらためて学習し直しました。
結構、間違えて覚えている方、いらっしゃると思います。