2005.05.02
テーマ： アクセス向上(301)
カテゴリ： 【実験中】
次はfont-variantです（小さくても大文字！！）
スタイルシート>>フォント>>font-variant
////////////////////////////////////////////////////////////////////////
【直接指定の記述方法】
ほとんどのタグの中でstyleは指定できます。（これは楽天広場でも使えます！）
<h1 style="宣言(指定内容を宣言と呼びます)" >アクセスアップのでめらら</h1>
【CSS本来の記述方法】
ソースのheadタグの中や外部ファイルを作って記述する場合（楽天ではできません;＞＜）
p {color: red;}
td {color: red;}
･･･etc
////////////////////////////////////////////////////////////////////////
■フォント
フォントの指定には以下のような種類があります。
□font-family（フォントのデザインの種類を指定します）
□font-style（通常体、イタリック体、斜体を区別して指定します）
□font-variant（英数文字の場合に、小文字／Small Caps を区別して指定します）
□font-weight（フォントの太さを指定します）
□font-stretch（レンダリングするフォントの形の幅を指定します）
////////////////////////////////////////////////////////////////////////
■font-variant（英数文字の場合に、小文字／Small Caps を区別して指定します）
□対象のフォント・ファミリーの、小文字(normal)／スモールキャプス(small-caps)の区別を指定します
□normal（デフォルト）
□inherit（ほとんど使いませんが、一応(;笑)、親要素の値を明示的に継承する指定の値です）
▲直接指定の記述方法
□<p style="font-variant: normal;" >normalを指定した文字、ABCDEFGHIJKLMNOPQRSTUVWXYZ、abcdefghijklmnopqrstuvwxyz</p>
↓こんな感じですね（＾＾）
□
<p style="font-variant: small-caps;" >small-capsを指定した文字、ABCDEFGHIJKLMNOPQRSTUVWXYZ、abcdefghijklmnopqrstuvwxyz</p>
↓こんな感じですね（＾＾）
▲CSS本来の記述方法
<style type="text/css">
<!--
P {
font-variant:normal;
}
-->
</style>
□font-family:との組み合わせ
▲直接指定の記述方法
font-family:sans-serif … ゴシック体系の場合
<p style="font-family: sans-serif; font-variant: normal;" >normalを指定した文字、ABCDEFGHIJKLMNOPQRSTUVWXYZ、abcdefghijklmnopqrstuvwxyz</p>
↓こんな感じですね（＾＾）
<p style="font-family: sans-serif; font-variant: small-caps;" >small-capsを指定した文字、ABCDEFGHIJKLMNOPQRSTUVWXYZ、abcdefghijklmnopqrstuvwxyz</p>
↓こんな感じですね（＾＾）
font-family:serif … 明朝体系の場合
<p style="font-family: serif; font-variant: normal;" >normalを指定した文字、ABCDEFGHIJKLMNOPQRSTUVWXYZ、abcdefghijklmnopqrstuvwxyz</p>
↓こんな感じですね（＾＾）
<p style="font-family: serif; font-variant: small-caps;" >small-capsを指定した文字、ABCDEFGHIJKLMNOPQRSTUVWXYZ、abcdefghijklmnopqrstuvwxyz</p>
↓こんな感じですね（＾＾）
▲CSS本来の記述方法
<style type="text/css">
<!--
P {
font-family: 'Times New Roman';
font-style: normal;
font-variant: small-caps;
}
-->
</style>
*****************************************************
【庶事所感】
フリーページの編集を始めました。
恐ろしいほどの誤字脱字です（＞＜）
･･･完成はいつになるのでしょう･･･
倦まず、諦めず、ゆっくりやろうと思います。
昨日、今日と「花粉」がちょっと来てるなぁ・・・という状況でして、鼻が痛いので集中力が無くって（＞＜）頑張らねば！
*****************************************************
なぜか行掛かりでBlogLankingに参加しました(^^;)面白かったらポチして下さいネ
リンクはフリーですご自由にどうぞ(バナーリンクタグはprofileのページ年表欄にあります）
スタイルシート>>フォント>>font-variant
////////////////////////////////////////////////////////////////////////
【直接指定の記述方法】
ほとんどのタグの中でstyleは指定できます。（これは楽天広場でも使えます！）
<h1 style="宣言(指定内容を宣言と呼びます)" >アクセスアップのでめらら</h1>
【CSS本来の記述方法】
ソースのheadタグの中や外部ファイルを作って記述する場合（楽天ではできません;＞＜）
p {color: red;}
td {color: red;}
･･･etc
////////////////////////////////////////////////////////////////////////
■フォント
フォントの指定には以下のような種類があります。
□font-family（フォントのデザインの種類を指定します）
□font-style（通常体、イタリック体、斜体を区別して指定します）
□font-variant（英数文字の場合に、小文字／Small Caps を区別して指定します）
□font-weight（フォントの太さを指定します）
□font-stretch（レンダリングするフォントの形の幅を指定します）
////////////////////////////////////////////////////////////////////////
■font-variant（英数文字の場合に、小文字／Small Caps を区別して指定します）
□対象のフォント・ファミリーの、小文字(normal)／スモールキャプス(small-caps)の区別を指定します
□normal（デフォルト）
□inherit（ほとんど使いませんが、一応(;笑)、親要素の値を明示的に継承する指定の値です）
▲直接指定の記述方法
□<p style="font-variant: normal;" >normalを指定した文字、ABCDEFGHIJKLMNOPQRSTUVWXYZ、abcdefghijklmnopqrstuvwxyz</p>
↓こんな感じですね（＾＾）
normalを指定した文字、ABCDEFGHIJKLMNOPQRSTUVWXYZ、abcdefghijklmnopqrstuvwxyz
□
<p style="font-variant: small-caps;" >small-capsを指定した文字、ABCDEFGHIJKLMNOPQRSTUVWXYZ、abcdefghijklmnopqrstuvwxyz</p>
↓こんな感じですね（＾＾）
small-capsを指定した文字、ABCDEFGHIJKLMNOPQRSTUVWXYZ、abcdefghijklmnopqrstuvwxyz
▲CSS本来の記述方法
<style type="text/css">
<!--
P {
font-variant:normal;
}
-->
</style>
□font-family:との組み合わせ
▲直接指定の記述方法
font-family:sans-serif … ゴシック体系の場合
<p style="font-family: sans-serif; font-variant: normal;" >normalを指定した文字、ABCDEFGHIJKLMNOPQRSTUVWXYZ、abcdefghijklmnopqrstuvwxyz</p>
↓こんな感じですね（＾＾）
normalを指定した文字、ABCDEFGHIJKLMNOPQRSTUVWXYZ、abcdefghijklmnopqrstuvwxyz
<p style="font-family: sans-serif; font-variant: small-caps;" >small-capsを指定した文字、ABCDEFGHIJKLMNOPQRSTUVWXYZ、abcdefghijklmnopqrstuvwxyz</p>
↓こんな感じですね（＾＾）
small-capsを指定した文字、ABCDEFGHIJKLMNOPQRSTUVWXYZ、abcdefghijklmnopqrstuvwxyz
font-family:serif … 明朝体系の場合
<p style="font-family: serif; font-variant: normal;" >normalを指定した文字、ABCDEFGHIJKLMNOPQRSTUVWXYZ、abcdefghijklmnopqrstuvwxyz</p>
↓こんな感じですね（＾＾）
normalを指定した文字、ABCDEFGHIJKLMNOPQRSTUVWXYZ、abcdefghijklmnopqrstuvwxyz
<p style="font-family: serif; font-variant: small-caps;" >small-capsを指定した文字、ABCDEFGHIJKLMNOPQRSTUVWXYZ、abcdefghijklmnopqrstuvwxyz</p>
↓こんな感じですね（＾＾）
small-capsを指定した文字、ABCDEFGHIJKLMNOPQRSTUVWXYZ、abcdefghijklmnopqrstuvwxyz
▲CSS本来の記述方法
<style type="text/css">
<!--
P {
font-family: 'Times New Roman';
font-style: normal;
font-variant: small-caps;
}
-->
</style>
*****************************************************
【庶事所感】
フリーページの編集を始めました。
恐ろしいほどの誤字脱字です（＞＜）
･･･完成はいつになるのでしょう･･･
倦まず、諦めず、ゆっくりやろうと思います。
昨日、今日と「花粉」がちょっと来てるなぁ・・・という状況でして、鼻が痛いので集中力が無くって（＞＜）頑張らねば！
*****************************************************
なぜか行掛かりでBlogLankingに参加しました(^^;)面白かったらポチして下さいネ
リンクはフリーですご自由にどうぞ(バナーリンクタグはprofileのページ年表欄にあります）
お気に入りの記事を「いいね！」で応援しよう
[【実験中】] カテゴリの最新記事
-
fontバリエーション(2) 2005.08.26 コメント(11)
-
スタイル一覧（後編） 2005.06.19 コメント(165)
【毎日開催】
15記事にいいね！で1ポイント
PR
Keyword Search
▼キーワード検索
Category
カテゴリ未分類
(96)【blog基本とマナー】
(8)【サイト作りの基礎】
(87)【テンプレート】
(49)【検索エンジンの理解】
(18)【検索エンジンに登録】
(5)【楽天広場のサイト】
(11)【アフィリエイト】
(12)【便利ツール】
(10)【実験中】
(76)Comments
© Rakuten Group, Inc.
