メインメニュー > EZSite News バックナンバー > [EZSite News 12] EZSite 4 のスタイルシート(フォント・画像編)

EZSite News バックナンバー

Print Prev Next

[EZSite News 12] EZSite 4 のスタイルシート(フォント・画像編)

2007年 2月 16日作成


 以下は、2007年 1月 16日に発行しましたメールマガジン「EZSite News」No.12 です。
 一部メールマガジン読者専用の内容を削除していますので、予めご了承ください。
 メールマガジン「EZSite News」購読希望の方は、「お問合せ受付」フォームにて「メルマガ希望」と記載してお申し込みください。全ての内容を含むバックナンバーを希望される方はお申し込みの際にその旨記載いただければ、別途メールさしあげます。



========================================================================

■ EZSite News - No.12 -              (2007年1月16日)■

========================================================================

 あけましておめでとうございます。

 今年も皆様にとって、良い年になることをお祈りいたします。本年も
EZSite を宜しくお願いいたします。

 さて、今回の EZSite News では、前回の「EZSite News」No.11
にてご紹介しました「EZSite 4 のスタイルシート」レイアウト編の続
きとして、フォントや画像の設定に関する Tips をいくつかお届けしま
す。最後までお読みいただければ幸いです。


------------------------------------------------------------------------
[目次]
------------------------------------------------------------------------
[1] EZSite 4 におけるフォント(文字列)に関するスタイルシート
  *** プロパティとクラス

[2] EZSite 4 における画像(挿絵)に関するスタイルシート
  *** プロパティとクラス

[3] 「EZSite 4 スターターパック」販売中!
  *** Lotus Domino Express をセットにしたお得なパックです!

[4] Lotus Notes/Domino 関連ニュース・ピックアップ


------------------------------------------------------------------------
[1] EZSite 4 におけるフォント(文字列)に関するスタイルシート
  *** フォントのプロパティとクラス
------------------------------------------------------------------------

■フォントに関するプロパティ

 EZSite 4 では、文字列に関するスタイルシートとして、基本的に以
下の7つのプロパティを使用しています。

 ・フォント・サイズ(font-size)
 ・フォント・ファミリー(font-family)
 ・フォント色(color)
 ・フォント・スタイル(font-style)
 ・フォント太さ(font-weight)
 ・行間(line-height)
 ・段落揃え(text-align)

 これらは必要なものだけを指定すれば良いようになっています。

 フォント・サイズとフォント・スタイル、フォント太さ、段落揃え
は、プルダウンから任意のものを選択することができます。

 フォント・ファミリーは、フォント名を指定します。フォント名を複
数指定する場合は、カンマ(,)で区切ってください。フォント名にス
ペースが含まれる場合は、必ずその前後を引用符(')または二重引用符
(")で囲ってください。フォント名については、EZSite 4 ヘルプの
「フォント・ファミリーの種類を表すキーワード」をご覧ください。

 フォント色は、[色一覧を開く]ボタンをクリックして、「色選択」
サブ・ウィンドウから指定することもできますし、直接 RGB の数値
(16 進数)または色の名前を入力して設定することもできます。

 行間は、任意の数値を入力して、単位を選択します。単位は、ポイン
ト、Pica、ピクセル、em、ex、ミリ、センチ、インチ、パーセントのい
ずれかを使用することができます。


■それ以外のプロパティ

 スタイルシートでは上記以外にも文字列に関するプロパティがありま
す。それらを利用されたい場合は、該当のクラスの[その他](入力欄
は、文字列以外のタブに表示されるものを使用してください)に入力し
ていただければ、それらのプロパティを利用することができます。


■フォントに関するクラス

 EZSite 4 で文字列に関するクラスとして予め規定しているものは、
メインメニュー用に6つ、ページ用に9つあります。文字列に関するプ
ロパティを設定したものは、EZSite 4 で自動的にスタイルシートを生
成しています。

 ・メインメニュー
   - サイト名(h1)
   - サイトの説明(.contents01)
   - 著作権表示(.cr01)
   - 新着情報(.wn01)
   - 見出し(h2)
   - メニュー(.mainmenu02 と .mainmenu03)

 ・ページ
   - カテゴリー(.category01)
   - 題名(.subject01)
   - 日付(.date01)
   - 本文(.body01)
   - 著作権表示(.cr01)
   - 一覧題名(.listSub)
   - 一覧概要(.listDes)
   - ナビゲーション・メニュー(.navi01)
   - ページ一覧(.navi02)

 各クラスについて設定したプロパティは全てのページにおいて共通し
て使用されます。

 これらを設定して EZSite 4 が生成するスタイルシートは以下のよ
うになります。(EZSite オフィシャル・ウェブサイトからの抜粋)

  .category01 { position: absolute; top: 60px; left:
  170px; width: 590px; text-shadow:Gray 4px 4px 6px;;
  line-height: 100%; text-align: left; font-size:
  16pt; color: #000000; font-style: normal; font-
  weight: bold; font-family: "ヒラギノ角ゴ Pro W3", "M
  S Pゴシック", Sans-Serif; }


<ご参考>
●[EZSite News バックナンバー 11] EZSite 4 のスタイルシート
 (レイアウト編)
 http://www.ezsite.ne.jp/v4/ez3_contents.nsf/s/enbn11

●各プロパティに関するヘルプ
 http://www.ezsite.ne.jp/help/ez3_help.nsf
 「管理メニュー」→「メインメニュー・デザイン情報」→「詳細設
 定」→「[詳細設定]設定項目」
 または
 「管理メニュー」→「ページ・デザイン情報」→「詳細設定」→
 「[詳細設定]設定項目」

●フォント・ファミリーに関するヘルプ
 http://www.ezsite.ne.jp/help/ez3_help.nsf
 「Appendix」→「フォント・ファミリーの種類を表すキーワード」


------------------------------------------------------------------------
[2] EZSite 4 における画像(挿絵)に関するスタイルシート
  *** プロパティとクラス
------------------------------------------------------------------------

■画像に関するプロパティ

 EZSite 4 では、挿絵に関するスタイルシートとして、基本的に以下
の7つのプロパティを使用しています。

 ・画像(ファイル名、サイズ、代替文字列)
 ・位置(position)
 ・上の位置(top)
 ・左の位置(left)
 ・余白(padding)
 ・重なり順序(z-index)
 ・その他

 これらは必要なものだけを指定すれば良いようになっています。

 画像(ファイル名、サイズ、代替文字列)は、[画像一覧を開く]ボ
タンをクリックして、「画像選択」サブ・ウィンドウから指定してくだ
さい。[サイズ]と[代替文字列]は直接入力して変更することができ
ますが、[ファイル名]は直接入力しても設定されません。このため、
使用する画像ファイルは予め画像情報に「挿絵」として登録しておいて
ください。

 位置や上の位置、左の位置はレイアウトのプロパティと同じです。

 余白は、該当の画像の領域と枠の幅を、ピクセル単位で数値を指定し
ます。

 重なり順序は、画像をレイヤーとして重ねる順序を指定します。重ね
る順序は、親の階層を 0 とする相対的な整数値で表され、値が大きい
ほど上に重なります。マイナス値を指定することもでき、その場合は下
に重ねられます。


■それ以外のプロパティ

 スタイルシートでは上記以外にも文字列に関するプロパティがありま
す。それらを利用されたい場合は、該当のクラスの[その他]に入力し
ていただければ、それらのプロパティを利用することができます。


■画像に関するクラス

 EZSite 4 で挿絵に関するクラスとして予め規定しているものは、メ
インメニュー用とページ用それぞれ4つずつあります。挿絵に関するプ
ロパティを設定したものは、EZSite 4 で自動的にスタイルシートを生
成しています。

 ・挿絵(.illust01)
 ・挿絵(.illust02)
 ・挿絵(.illust03)
 ・挿絵(.illust04)

 「[EZSite News バックナンバー 11] EZSite 4 のスタイルシー
ト(レイアウト編)」の「[2] EZSite 4 におけるレイアウトに関す
るスタイルシート 2」でご紹介したように、「.illust01」と
「.illust02」は HTML コードの中では前の方に、「.illust03」と
「.illust04」は後ろの方に生成されますので、重なり順序(z-
index)は「.illust01」と「.illust02」は下の方に、
「.illust03」と「.illust04」は上の方になります。このため、デザ
インによっては、「.illust01」と「.illust02」が隠れてしまうこと
があるかもしれませんので、そのような場合には重なり順序(z-
index)を設定して、より上のレイヤーで表示されるように調整してく
ださい。

 各クラスについて設定したプロパティは全てのページにおいて共通し
て使用されます。

 これらを設定して EZSite 4 が生成するスタイルシートは以下のよ
うになります。(EZSite オフィシャル・ウェブサイトからの抜粋)

  .illust04 { position: relative; top: 70px; left:
  0px; z-index: 0; }


<ご参考>
●[EZSite News バックナンバー 11] EZSite 4 のスタイルシート
 (レイアウト編)
 http://www.ezsite.ne.jp/v4/ez3_contents.nsf/s/enbn11

●各プロパティに関するヘルプ
 http://www.ezsite.ne.jp/help/ez3_help.nsf
 「管理メニュー」→「メインメニュー・デザイン情報」→「詳細設
 定」→「[詳細設定]設定項目」
 または
 「管理メニュー」→「ページ・デザイン情報」→「詳細設定」→
 「[詳細設定]設定項目」


------------------------------------------------------------------------
[3] 「EZSite 4 スターターパック」販売中!
------------------------------------------------------------------------
 EZSite 4 の導入をご検討のお客様は、是非「EZSite 4 スターター
パック」をご検討ください。

 このパックは、「EZSite 4 基本パック」と「Lotus Domino
Express」ライセンスをセットにしたもので、EZSite 4 をご利用いた
だくために必要なソフトウェアとライセンスを一括して入手いただけま
すので、これまでよりもさらに迅速に Web サイトを構築いただくこと
ができます。

 同梱する「Lotus Domino Express」ライセンスは 2 ライセンスで
すが、更にライセンスを追加されたい場合は、Lotus Domino Express
キャンペーンもご利用いただけます。

■名称:「EZSite 4 スターターパック」

■内容:
   ・EZSite 4 基本パック(1 ライセンス)
   ・Lotus Domino Collaboration Express(2 ライセンス)

■価格:200,000円(税抜き価格)


------------------------------------------------------------------------
[4] Lotus Notes/Domino 関連ニュース・ピックアップ
------------------------------------------------------------------------
 日本 IBM から Lotus Notes/Domino に関します情報が多数公開さ
れています。この中からいくつかご紹介します。詳細につきましては、
「IBM Lotus サポート/技術情報 - Japan」をご覧ください。

<ご参考>
●IBM - 730102: ドメイン検索フォームで詳細検索を指定した場合、
 意図しない検索結果数が返る場合がある
 http://www.ibm.com/jp/domino04/lotus/support/faqs/faqs.nsf/all/730102

●IBM - 730232: Lotus Notes/Domino における Windows の
 Service Pack サポートについて
 http://www.ibm.com/jp/domino04/lotus/support/faqs/faqs.nsf/all/730232


●IBM Lotus サポート/技術情報 - Japan
 http://www.ibm.com/jp/software/lotus/techsupport/index.html


------------------------------------------------------------------------
☆最後までお読みいただきまして、ありがとうございました。☆

今後とも皆様に有意義な情報をご提供するために、本メールマガジンに
関しまして、忌憚ないご意見・ご要望などお寄せください。

また、EZSite に関するご質問やご要望もお待ちしています。

いずれも Web サイトまたはメールのいずれからも受け付けていますの
で、お気軽にお送りください。

・お問合せ受付(Web サイト)
  http://www.ezsite.ne.jp/v4/ez3_accept_fb.nsf/Accept
・メール
  mailto:ezsite_sales@bcom.co.jp

■配信中止、配信先変更をご希望の方
 本メールへの返信にて承ります。
 配信先変更の場合は、変更先のメールアドレスをお忘れ無く記載くだ
 さい。

■本メールは弊社が定める「プライバシーポリシー」及び個人情報の利
 用目的に沿って送信しております。
 http://www.ezsite.ne.jp/v4/ez3_contents.nsf/s/policy

<最新ニュースは、EZSite 4 オフィシャル・ウェブサイトへ>
  http://www.ezsite.ne.jp/

========================================================================
EZSite News
発信元:株式会社ベストコミュニケーションズ
    http://www.bcom.co.jp/
担当:木村 典昭
お問い合わせ先:
  mailto:ezsite_sales@bcom.co.jp
  Tel: 03-5355-5885
  Fax: 03-5355-5886
========================================================================
Copyright (C) 2007 BestCommunications, Inc. All Rights Reserved.

Print Prev Next












© 2024 ケートリック株式会社