ホームページ制作講座

ホームページ制作のHTMLやCSS、JavascriptやDTDとかDreamweaverなどWEB制作について

CSS

CSS背景画像のサイズを変更する問題解決集backgroundのサイズ変更解決する

CSS背景画像のサイズを変更するに関係のある知識が必要な場合は、サーチ検索では下の関連キーワードで検索してもよいでしょう。CSS背景画像のサイズを変更するについてより理解を深めるための検索キーワードの組み合わせには、background-size:background-si…

CSS heightとwidthプロパティのvh/vw/vmin/vmaxの知識

CSS heightとwidthプロパティのvh/vw/vmin/vmaxに関係のある知識が必要な場合は、サーチ検索では下の関連キーワードで検索してもよいでしょう。 CSS heightとwidthプロパティのvh/vw/vmin/vmaxについてより理解を深めるための検索キーワードの組み合わせには…

画像のtext-align:centerが効かない時の解決方法

ブロック要素内でimgタグをCSSでtext-align:centerで指定しても、ブロック内の中央に配置されない。テキストを配置した場合には正しくセンタリングされるのである。 imgタグのCSSセレクタにdisplay:blockプロパティが指定されていたので、優先度の高いセレク…

CSSセレクタのプロパティの値inheritに関する記事

CSSプロパティ値でたまに"inherit"なる値が設定されていたりする。inherit(インヘリット)とは、『継承』という意味で、このセレクタの親要素のプロパティ値を強制的に継承させるという意味です。継承させたい同一のプロパティ値が大量にある場合は有効ですが…

リンク画像イメージの点線枠囲み線を消すためのCSSプロパティ

ホームページ内にaタグでURLリンクを貼りつけたイメージ画像ですが、選択時やページ内でクリックした場合などは、画像の周りに点線の枠が見られます。 マウスオーバー時のマウスカーソル同様、どの画像が選択されクリッカブルなのかをユーザーに知らせてくれ…

CSSセレクタの優先順位を指定する!important宣言

CSSはカスケード(段階や構造)化された名前の通り、最後に記述されたセレクタが優先され、各セレクタの優先順位はIDセレクタ、クラスセレクタとなっています。また、import(ブラウザによっては読み込みが遅くなる)などでCSSファイルを指定した場合もその記述…

CSSスプライトについて

CSSスプライトとは、.. 画像の呼び出しは、キャッシュが残っていたりしない場合は、プリロードするか表示する度にリクエストするので、回線やサイト閲覧に多少不可がかかり、表示が遅くなったりします。CSSスプライトで画像をなるべく一度の読み込みで完了さ…

Flashやimg、アンカーリンクの周りの点線を消す方法

読み込むHTMLページに背景色を指定し制作したFlashコンテンツやリンクを貼ったimgタグをFirefoxでプレビューしたところ、flashやimgタグの周りに点線が表示される。背景色が濃い場合ですが点線が目立つので、点線を消す方法が必要です。 それにはswfファイル…

table内のボーダーを重ねるborder-collapse

table内のセルにボーダーを指定した場合、隣り合う線が並ぶので1pxで指定した場合、テーブルの左右の端のみ1pxボーダーで、内部のセルが隣接する部分が2pxになり、すこし見栄えがよくないので、この部分を重ねます。 CSSのセレクタ内にborder-collapseプロパ…

list-style-positionプロパティでレイアウト崩れを直す

ul(Unordered List=順序のないリスト) とli(List Item)などを使用する場合、マーカーリストのタイプlist-style-typeやマーカーの位置について記述する必要があります。これらの記述はブラウザごとに解釈がまちまちであったり、階層構造によってはCSSのプロパ…

CSS3対応ブラウザ一覧

CSS3対応ブラウザ一覧CSS3対応ブラウザ一覧はまず、対応一覧サイトで。http://www.findmebyip.com/litmus/カスケードスタイルシートのヴァージョン3、CSS3ですが、新しい言語ではないようです。従来のCSS2との互換性もあり、セレクタやプロパティのcss2拡張…

margin:autoセンタリングCSS

WEBサイト制作時に、最近はブラウザウィンドウの中央にコンテンツ表示させるセンタリングがかなり標準的に なってきました。CSSで制御する場合、margin:auto;でdivタグなどのブロックレベル要素を中央に表示させるわけですが、 記述方法と×などについてまと…

imgタグの枠線を消してみる

imgタグをアンカータグで囲んだ場合、Aタグ内のイメージ画像をクリックすると、リンク参照ができるようになりますが、まれにリンクの枠線がイメージ画像を囲んでしまう場合があります。 機能やレイアウトにはまったく問題ないのですが、(ブラウザFireFoxでは…

CSS入力指定のinputタグime-mode

メールフォームなどで使用されるinputタグのtype=textにCSS指定で半角全角入力の指定が可能な"ime-mode"プロパティがありますが、 値の種類についてまとめてみました。 ime-modeとはテキスト入力時のIMEの入力モードを指定するInternet Explorerで独自に追加…

imgとテキスト、水平に揃わない

CSS

テキストに画像の回り込みや、同じブロック上に配置する場合ですが、入れ子になるCSSの指定方法によってはブラウザでの表示の仕方がことなり、テキストと画像の水平位置が揃わないことがあります。 その場合、imgタグに回り込み指定や、CSSのvertical-align…