縦横比を保ったまま画像のサイズを変えて表示する方法です。
例えば、ウェブサイトをPCで閲覧するためのサイズとスマホで閲覧するサイズの2種類をCSSで切り替えてつくる場合、画像のサイズもPCとスマホによって切り替えたいときに、この方法を使います。
横か縦のサイズを明示的に指定した場合、もう一方のサイズを計算しなければならないのは面倒です。
そういった場合は、もう一方のサイズにautoを指定します。
widthを%で指定しても同じです。
ウェブサイトをスマホ対応しようとCSSをつくり、いざ確認してみるとAndroidとiPhoneで文字サイズがかなり違う、ということが起こりました。 iPhoneの方がAndroidよりも小さく、iPh…続きを読む
Chromeでウェブサイトをチェックしている場合、CSSを更新した際にブラウザの更新を行って再表示しても、CSSの変更が反映されません。 これはキャッシュがChrome内に残っているために起こっている…続きを読む
Windows7からWindows10にアップグレードしたところ、Apacheが起動しなくなりました。 Apacheが起動しなくなる理由には大きく2つあります。 1つ目は、httpd.confの書き間…続きを読む
ウェブサイトの表示をさせる際に、自分で指定したフォントで相手にも表示させる方法です。 通常、ウェブサイトのフォントは、閲覧する人のコンピュータに同じフォントがなければ、CSSでfont-familyを…続きを読む
FTPソフトである「FileZilla」を使ってサーバ上のファイルを削除しようとしたときに、 「8ビット文字コードへ変換するコマンドに失敗しました」 というメッセージが出てしまい、削除できないことがあ…続きを読む
Microsoft Edgeのキャッシュを削除する方法を調べました。 Edgeの右上の設定アイコンから「設定」をクリックします。 「Cookieとサイトのアクセス許可」から、「Cookieとサイトデー…続きを読む
CSSで、マウスオーバー時に、徐々に色が変化したり、形が変化するようなアニメーション効果を付ける方法です。 CSS3で実現 例えば、マウスオーバー時に色を徐々に変化させたい場合には、以下のように書きま…続きを読む
Googleカレンダーに、別のGoogleアカウントのカレンダーを同期させることはできますが、別のGoogleアカウントで複数設定しているカレンダーをそれぞれ同期させる方法がわからなかったので調べまし…続きを読む
CSSの設定のみで、内容が少ないページであっても、フッターは最下部に表示され、さらに内容がたくさん書いてある場合には、スクロールした最後にフッターが表示されるようにする方法です。 以前にも紹介しました…続きを読む
CSSでfloatを使って二段組レイアウトをつくった場合、フッターにfloatの効果を解除するには、clear:bothなどを使っていました。 しかし、clear:bothを使うと、marginなどの…続きを読む