WEBサイト制作で調べたことのメモ

CSS★画像を右寄せにする

投稿日：2018年12月14日

このページのもくじ

デフォルトは左寄せになっています。

（１）画像をブロック要素として囲む。
　　　ブロック要素= div・p・ul・li・dl など

ブロック要素に幅（width）を指定して画像に「margin-left: auto;」を指定

<HTML>

<div class="box"><img src="../jpg" alt="test" class="img-right"></div>

1	<div class="box"><img src="../jpg" alt="test" class="img-right"></div>

<CSS>

.box {width: 700px;}
.right {margin-left: auto;}

1 2	.box {width: 700px;} .right {margin-left: auto;}

＜デモ＞

◎右寄せのCSS設定

執筆者：kobato

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください。

リンク文字のホバーエフェクトでつまずいたときのメモ。 <HTML>

&lt;a href=“#" class="demo1"&gt;
リンクテキストのマウスオーバー
リンクテキストとマウスーバーの色を変更したいとき、
CSSで設定する方法は、よく使います。
&lt;/a&gt;

リンクテキストのマウスオーバー

リンクテキストとマウスーバーの色を変更したいとき、

CSSで設定する方法は、よく使います。

</a>

<CSS> [crayon-5c919dd …

: WP★吹き出し風デザインをCSSだけでやる方法

このページのもくじワードプレスでプラグインを使わずに、 HTMLとCSSだけで下のような感じの会話風レイアウトの作り方。手順はこちらもっと便利に！ワードプレスでプラグインを使わずに、 HTMLとC …

: CSSでテーブルの背景色を交互に変える方法

今さらですが… CSSだけで表の背景色を交互に変える方法の覚え書き。 ※IE8以下のブラウザには対応していません。でも、マイクロソフトはIE8のサポートを終了したので、これからはどんどん使えそうです …

: CSS★丸い背景+円形の中央に文字

cssのメモ。このページのもくじ丸形の作り方円形の中央に文字を置くやり方★その２丸形の作り方基本的な方法は、（１）div 要素で囲った範囲の上下左右のサイズを指定する（height, wid …

: 今からレスポンシブサイトを作る時のメディアクエリとブレイクポイント【2017年度版】

新しくサイトを作ることになった。もちろん、レスポンシブ対応で。そこで改めて、ブレイクポイントを考えてみことにした。 Googleでは「モバイルファースト」を推奨している。さらに「モバイルファースト …