テンプレートとアクセスアップのでめらら楽天日記

2005.04.30
XML
カテゴリ: 【実験中】
スタイルシート(3)

ちょっとややこしくなってきますので、「パンくず」表示させていただきますね(^^)

スタイルシート>>フォント>>font-family
////////////////////////////////////////////////////////////////////////

【まずは・・・】
スタイルシートの最大の魅力はcssファイルを使用することで、htmlソースを簡素化させることでの更新時の利便性を図ることと検索エンジンへの対応の期待ですが、段階的に理解するため
1.)スタイルの直接指定での使用方法とそれぞれの機能
2.)クラス使用のhead内の記述
3.)cssファイルの作成


【直接指定の記述方法】
ほとんどのタグの中でstyleは指定できます。(これは楽天広場でも使えます!)

<h1 style="宣言(指定内容を宣言と呼びます)" >アクセスアップのでめらら</h1>
<div style="color: red;" >アクセスアップのでめらら</div>
<span style="color: red;" >アクセスアップのでめらら</span>
<p style="color: red;" >アクセスアップのでめらら</p>
<th style="color: red;"
<td style="color: red;" >アクセスアップのでめらら</td>
・・・etc

【CSS本来の記述方法】
ソースのheadタグの中や外部ファイルを作って記述する場合(楽天ではできません;><)


p {color: red;}
td {color: red;}
・・・etc

////////////////////////////////////////////////////////////////////////

■フォント
フォントの指定には以下のような種類があります。

□font-family(フォントのデザインの種類を指定します)
□font-style(通常体、イタリック体、斜体を区別して指定します)
□font-variant(英数文字の場合に、小文字/Small Caps を区別して指定します)
□font-weight(フォントの太さを指定します)
□font-stretch(レンダリングするフォントの形の幅を指定します)
□font-size(フォントの大きさを指定します。フォントの大文字と小文字の比率に基づく 'font-size-adjust' も同時に指定できます)

////////////////////////////////////////////////////////////////////////

■font-family(フォントのデザインの種類を指定します)


□具体的フォント名で指定(対象の字体フォントがインストールされていませんと表示されません)
※フォント名にスペースが含まれる場合は、ダブルクォーテーション( " )かシングルクォーテーション( ' )で囲みます
【例】'MS Pゴシック'や"MS Pゴシック"

▲直接指定の記述方法
<p style="font-family:江戸勘亭流" >江戸勘亭流体のフォント</p>
↓こんな感じですね(^^)

江戸勘亭流体のフォント


▲CSS本来の記述方法
<style type="text/css">
<!--

P {
font-family: "MS P明朝";
}

-->
</style>


□体系フォントの種類で指定(汎用性を考えたものでgeneric-familyといいます)
sans-serif … ゴシック体系
serif … 明朝体系
cursive … 筆記体系
fantasy … 装飾系
monospace … 等幅系

▲直接指定の記述方法
<p style="font-family:sans-serif" >sans-serifのフォント</p>
↓こんな感じですね(^^)

sans-serifのフォント


<p style="font-family:serif" >serifのフォント</p>
↓こんな感じですね(^^)

serifのフォント


<p style="font-family:cursive" >cursiveのフォント</p>
↓こんな感じですね(^^)

cursiveのフォント


<p style="font-family:fantasy" >fantasyのフォント</p>
↓こんな感じですね(^^)

fantasyのフォント


<p style="font-family:monospace" >monospaceフォント</p>
↓こんな感じですね(^^)

monospaceフォント


▲CSS本来の記述方法
<style type="text/css">
<!--

P {
font-family:serif;
}

-->
</style>


□いくつか候補を用意する
▲直接指定の記述方法
<p style="font-family: "候補 1","候補 2","候補 3"; " >インストールされているフォント</p>
【例】
<p style="font-family:Gergia, "MS 明朝", serif" >インストールされているフォント</p>

▲CSS本来の記述方法
<style type="text/css">
<!--

P {
font-family:"候補 1","候補 2","候補 3";
}

-->
</style>

*****************************************************
【庶事所感】
『タレント・萩本欽一(63)が監督を務める野球クラブチーム「茨城ゴールデンゴールズ」の公式応援歌「筑波山麓Go★Go伝説」の公開レコーディングが28日、都内で行われた。
作詞、作曲を担当したメーンボーカルのトータス松本に加え、バックコーラスに欽ちゃんと、女性投手の片岡安祐美選手(18)、さらに藤本博史(28)、仁平翔(18)、雀ケ野賢太(21)、鹿取真央(19)のイケメン4選手が参加。ノリノリで見事にそろった歌声を披露した。』
なんだか毎日、ニュース番組コンテンツが悲しく辛い情報が多くて、本当に心の痛む記事ばかりなのですが、そんな中で今日目に入ったのがこの記事。
トータス松本さん、その場で『欽ちゃん球団』に入団ですって(^^)

*****************************************************

なぜか行掛かりでBlogLankingに参加しました(^^;)面白かったらポチして下さいネ

ランキング



リンクはフリーですご自由にどうぞ(バナーリンクタグはprofileのページ年表欄にあります)





お気に入りの記事を「いいね!」で応援しよう

Last updated  2005.07.22 16:34:23
コメント(4) | コメントを書く
[【実験中】] カテゴリの最新記事


【毎日開催】
15記事にいいね!で1ポイント
10秒滞在
いいね! -- / --
おめでとうございます!
ミッションを達成しました。
※「ポイントを獲得する」ボタンを押すと広告が表示されます。
x
X

PR

Keyword Search

▼キーワード検索

Comments

主婦が携帯スマホで月収100万を稼ぐ方法@ 主婦が携帯スマホで月収100万を稼ぐ方法 主婦が携帯スマホで月収100万を稼ぐ方法 …
fipyaqh@ fipyaqh BanUgR &lt;a href=&quot; <small> <a hr…
krjxyqcvrh@ krjxyqcvrh kOkt2k &lt;a href=&quot; <small> <a hr…

© Rakuten Group, Inc.
X
Design a Mobile Site
スマートフォン版を閲覧 | PC版を閲覧
Share by: