2009/9/30 水曜日

【MS Word2007】スタイル~エンジニアのためのWord再入門講座を読んで~

Filed under: 未分類 — renji @ 10:29:09

MS-Wordの肝!!「スタイル」

Webデザイナーに馴染みやすい「スタイル」の概念

Webデザインで言うところの「HTML」と「CSS」の関係と同じ。

文書構造とデザインを切り離して、デザインを統一管理するための仕組み。

CSSにあたる部分が「スタイル」となります。

スタイルの種類

Wordのスタイルには

  1. 段落に適用されるもの
  2. 文字に適用されるもの
  3. 表に適用されるもの
  4. 箇条書きに適用されるもの

の計4種類があります。

段落スタイル(段落に適用されるもの)

段落スタイルは段落全体の書式を指定します。段落の、

  • 利用するフォント
  • 文字列の配置(左揃え、右揃え、中央揃えetc.)
  • タブ位置
  • 行間隔
  • 罫線
  • インデントや上下左右のマージン
  • 箇条書き/番号付けの定義

など、段落の外観に関する書式設定をすべて制御することが可能です。

Wordでのスタイル定義の中心的存在となります。

文字スタイル(文字に適用されるもの)

文字スタイルは、選択された特定の範囲の文字に対してのみ書式の設定を行うものです。

段落スタイルと別に書式スタイルが用意されているのは、

段落中の特定の文字を強調する、
たとえば、プログラムのコードやコマンド名、引用先の表記など

の書式を変更するという要望に応えるものです。

HTMLで言えばcodeやstrongといった「インライン要素」に対応するものと言えるでしょう。

文字スタイルではフォントの指定はもちろん、該当箇所に対する罫線や網掛けの付与などを行うことができます。

表スタイル(表に適用されるもの)

表スタイルは、表全体、または表中の特定の行/列/セルに対する書式や罫線/網掛けの設定を行うための定義です。

具体的には、

  • 偶数行と奇数行で異なった背景色を付ける
  • 先頭の行のみ異なった書式を利用する

などと言ったことが実現できます。

リストスタイル(箇条書きに適用されるもの)

リストスタイルは、特定の段落に対する箇条書きの書式を定義するものです。

段落に対して追加で設定することで、箇条書きを示す

  • 行頭文字(「・」や「■」)
  • 段落番号

を後から追加できます。

リストスタイルでは、「階層を持った箇条書き 」を設定することが可能ですが、この階層がインデントの深さ(正確には、段落の最初の文字がドキュメントの左端からどの程度離れているか)によって決定されるからです。

インデント付けされた段落とは相性が悪いため、この書籍の筆者の方は利用していないとのこと。

組み込みのスタイルとスタイルの階層

Wordには最初から様々な定義済みスタイルがあります。

デフォルトでは表示されていないものもすべて表示するには

[スタイル]ウィンドウ→[オプション]をクリック→[表示するスタイル]→[すべてのスタイル]

を選択します。

組み込みのリストスタイル

事前定義の「リストスタイル」です。段落に付与する段落番号の形式に応じて「1/1.1/1.1.」や「章/節」などが設定されます。

組み込みの表スタイル

事前定義の「表スタイル」です。「表(紫)」や「表(クラシック)」などがあります。

HTMLに関係したスタイル

「HTMLタイプライタ」(tt要素に対応)や「HTMLキーボード」(kbd要素に対応)などがあります。

Wordの機能に関係するもの

「コメント」や「ハイパーリンク」、「見出しマップ」や「脚注参照/脚注文字列」のように、Wordが提供する昨日で内部的に利用されているものです。

見出し

「見出し1」から「見出し9」までの9つのスタイルは、Wordがデフォルトで「見出し」として認識するものです。これらのスタイルが適用された段落は、目次作成時に目次項目の対象となります。ドキュメント中の各章の見出しは、このスタイルによって実現します。

目次/索引

「目次1」から「目次9」、「索引1」から「索引9」は、それぞれ目次/索引の内部で使われるスタイルとなっています。独自にカスタマイズすることによって、目次や索引の外観を変更することができます。

箇条書きと段落番号

「箇条書き」は箇条書きの行頭文字が、「段落番号」は段落番号があらかじめ付与されたスタイルです。

「箇条書き継続行」は「箇条書き」に続く段落として違和感が無いように調整されたスタイルです。

標準

ほぼ全ての段落スタイルの親となっているスタイルです。デフォルトでは、このスタイルが適用されますが、「標準」スタイルの利用やカスタマイズを避けて下さい。このスタイルが変更されると、他のほとんどのスタイルにも影響が及ぶからです。

本文

「標準」を基準スタイルとしただけの、スタイルであり、結果として「標準」スタイルと、全く同じ定義を持っています。「標準」スタイルを使いたくない場合は、この「本文」スタイルを利用します。

段落フォント

全ての文字スタイルの親となるスタイルです。

このスタイルには実態は無く、その時点でカーソルが存在する段落スタイルのフォント定義がそのままつかわれるようになっています。

標準の表

全ての表スタイルの親となるスタイルです。

スタイルの秘密~親子関係~

スタイルの親子関係

[スタイルの変更]ダイアログウィンドウの[スタイルの変更]プロパティの中にkijunstyle.jpg

[基準にするスタイル]

という欄があります。

スタイルの定義では、この「基準とするスタイル」に、

基準とするスタイルを定義すること

で、スタイル間で「親子関係」を持たせることができます。

親子関係のルールは

  • 子は 親の定義を引き継ぐことができる
  • 親の定義を変更すると子が引き継いだ定義も影響を受ける
  • 子では独自に親の定義を変更することができる
  • 子で独自に変更された定義は親がその定義を変更しても子の定義は影響を受けない

となります。

スタイル間での親子関係の確認

「親子関係のルール」が適切に扱われているか、実際に二つのスタイルを用いて確認してみます。

kijun75_001.jpg

親スタイル名:本文

基準スタイル:標準

子スタイル名:本文インデント

基準スタイル:本文

の2つを用意します。

子スタイルの「本文インデント」では、親スタイルに「本文」を置きながら、独自にインデントを変更しています。

それぞれの親子関係を確認するために、親スタイル「本文」の

  • フォントを太字に変更する。
  • インデント幅を「本文インデント」よりも深くする

を変更した後、子スタイル「本文インデント」がどのようになるか見てみましょう。

styles.jpg

のように最初の段落にスタイル「本文」を適用し、次の段落にスタイル「本文インデント」を適用しています。ここで、スタイル「本文」の

  • フォントを太字に変更する。
  • インデント幅を「本文インデント」よりも深くする

スタイルを、以下のダイアログのように、

stylehenkou.jpg

変更すると、styleword.jpg

といったように、

【子スタイルに継承される】

親スタイルが「文字フォント:太字」にしたため、子スタイルで変更していない「文字フォント」が継承され、同様に「文字フォント:太字」になっている。

【子スタイルに継承されていない】

親スタイル「本文」のインデントが変更(左8文字)していますが、子スタイルは独自にインデントを変更(左4文字)していますので、親スタイルの影響を受けていないことがわかります。(インデント左4文字のまま)。

このことからも親子関係のルール、

  • 子は 親の定義を引き継ぐことができる
  • 親の定義を変更すると子が引き継いだ定義も影響を受ける
  • 子では独自に親の定義を変更することができる
  • 子で独自に変更された定義は親がその定義を変更しても子の定義は影響を受けない

が適用されていることになります。(o^ー’)b

2007/6/28 木曜日

【お詫び】IE6 Winでご覧の方へ

Filed under: 未分類 — renji @ 14:58:20

えっとすいません標題環境でご覧の方、レイアウトが激しく崩れていると思います。

うーん。WebDesigner失格。

時間作って直します。

普段Flashばっかりやっているのにかまかけていたのですが。。。

せっかくの機会なので本腰入れてCSSもきちんと覚えろということですね。^^;

当面御見苦しいところを晒しますが気長にお付き合い頂ければ幸いです。m(_ _)m

2007/6/27 水曜日

【?】捜し物~大学サイト~

Filed under: 未分類 — renji @ 16:05:18

どこかの大学のサイトで。。。

上から撮影したような映像で、実写

始めに「スクールバス」が走ってきて。。。

大学の入口で停車。で、ぞろぞろと学生たちがバスから降りてくる。

そして大学内を見て回る。。。

みたいなイントロだかナビゲーションだかFlashで表現されていたサイトってどなたか覚えていませんか?

コメントいただけると助かります。

2007/4/3 火曜日

いやぁもう。。。

Filed under: 未分類 — renji @ 20:27:43

ヤバすぎ。

全然落ち着かない。

どうにもならない。

今は粛々とこなしていくのみ。

ここももっともっと活性化させないと。

頑張る!

2007/3/19 月曜日

【Flash】Apollo α Now Available!!!!!!

Filed under: 未分類 — renji @ 18:30:51

apollo_banner

2007.03.16にサンフランシスコで行われた「Apollo Camp」の開催を目処にAdobe Lab.でApolloの諸々がでると言われていましたが、いよいよα版がAdobe Lab.ダウンロードできるようになってます。

【Adobe Lab. tech “Apollo”】

http://labs.adobe.com/technologies/apollo/

ITmediaでも記事出てますね。(o^ー’)b

【ITmedia】Adobe、Apolloの公開α版をリリース

http://www.itmedia.co.jp/news/articles/0703/19/news039.html

Apolloコンテンツ VS. WPFコンテンツ

「脱ブラウザ」を視野に入れているAdobeとMicrosoftの行く末はどうなりますかね?

HTML convert time: 0.293 sec. Powered by WordPress ME