プログラミング

サイズの違う画像の縦横比をキープしつつ、同じサイズで表示するレスポンシブ対応

画像を縦なり横なりに並べる時、サイズの異なる画像を混ぜると、一つだけ横幅が足りなかったり、画像の高さが違って不格好になったりしてしまいました。

わざわざ同じサイズの画像を使用するルールを決めるのも煩雑なので、異なるサイズの画像を複数表示しても、画像の縦横比率はキープしたまま同じ縦横サイズで見切れて表示させるスタイルの当て方をまとめました。

続きを読む

basic認証のかけ方

サイト全体にベーシック認証をかける場合です。

公開パスのルートに .htaccessを作成して以下を記述

.htpasswdを指定のパス(上記のコードの場合公開パスのルート)に作成して以下で生成する内容を記述.

.htpasswdに入力するパスワードはApacheのある環境でコマンドを打って作成するか、以下のサイトのようなシステムを利用しても作成可能。

.htaccess による認証用 パスワード暗号化ツール

windowsのローカルで作成する場合、こちらのサイトを参照

line-heightでtransitoinが効かない

line-hgiehtでtransitionが効かないときは、line-heightの値をpxで指定していないか注意。

line-heightは、`line-height: 1;` のように、単位をつけずに指定することで、trnasitionが動く。

xamppで複数のサイトをローカルで管理する方法

ルートのパスを設定する(web root)ことにもなる。windowsでの環境構築です。

C:\xampp\apache\conf\httpd.conf 60行目あたりにある Listen 80 の次の行に追加したい番号を入力します。51行目から張り付けると以下のようになります。

続きを読む