ホームページ制作講座

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

記号が小さく表示される状況をCSS font-familyを利用して解決してみましょう。

今回のホームページ制作講座では表示が小さい記号文字を対処する一連の流れについてHTMLソースのプロパティfont-familyで解決に関して説明しています。

 

[第1の工程]

ここではCSSファイルを使用して、特定記号〇や△などを表示指定する一番最後に読み込まれるセレクタの場所を特定してみます。

 

[第2の工程]

次工程ではfont-familyプロパティにて、font-family: ""メイリオ"", Meiryo, Osaka, ""MS Pゴシック"", ""MS PGothic"",'Century Gothic', sans-serif; などで指定という作業を行います。

 

[第3の工程]

最終工程として、対象ページにて、キャッシュクリア後に特定の記号の大きさが通常サイズか確認という工程でこの講座内容は完了します。

 

この記事内容について注意したい点がありますが、それはfont-familyを指定しても、CSSセレクタの優先順位や読み込まれる順番などにより正しく反映されない場合があるに関しては留意しておいた方がよいでしょう。

正規表現の記号をDreamWeaver 検索および置換を利用して一括置換してみましょう。

今回のホームページ制作講座では記号部分を正規表現での置換する一連の流れについてドリームウィーバーの置換機能で一括置換に関して説明しています。

 

[第1の工程]

ここではドリームウィーバーを使用して、起動して対象HTMLファイルを表示してみます。

 

[第2の工程]

では検索および置換から、[編集]⇒[検索/置換(F)]か、ショートカットキーCtrl+Fでダイアログを表示し正規表現にチェックという作業を行います。

 

[第3の工程]

最終工程として、置換対象にて、置換する対象内の正規表現の記号を""[ ]""で囲い一括置換という工程でこの講座内容は完了します。

 

この記事内容について注意したい点がありますが、それは一括置換に含まれやすい""ダブルコーテーションも正規表現の記号となることに関しては留意しておいた方がよいでしょう。

CSS背景の透過問題解決集backgroundの背景画像と背景色解決する

css背景画像と背景色の透過に関係のある知識が必要な場合は、サーチ検索では下の関連キーワードで検索してもよいでしょう。

 

css背景画像と背景色の透過の問題解決について。

cssによる背景色や背景画像の透過指定方法は、主に2種類の指定方法があり希望するビジュアル効果による指定方法
ことです。

問題解決については、単純に要素透過させたい場合

opacity:0.5;

とすることでレイヤー自体を透過させることができる。
ただこの場合は、子レイヤーすべてと背景とともに文字が含まれていた場合、文字も透過されてしまうので、
背景色のみを透過させる場合は、

background: rgba(255, 255, 255, 1.0);と指定
があります。


問題解決について、背景画像のみを透過させたい場合は、background:rgbaプロパティで値を指定するか、
背景色のみを透過させるレイヤーを内部に制作して、背景色を透過させることで疑似的に背景画像を透過させる方法のいずれかとなる
というところにあります。


分類としては背景画像と背景色およびCSS背景の透過にカテゴライズされる。