2005.05.08
テーマ： アクセス向上(301)
カテゴリ： 【実験中】
font周りのスタイル-「text-decoration」
fontのスタイルではないのですがテキストを修飾するスタイルがいくつかあります。
スタイルシート>>フォント>>font周りのスタイル(1)
////////////////////////////////////////////////////////////////////////
■zoom（拡大を指定するプロパティ）
■color（文字色を指定するプロパティ）
■text-decoration（文字の装飾線、点滅を指定するプロパティ）
■zoom（拡大を指定するプロパティ）
zoom: 1.5; … 1.5倍に拡大
zoom: 1; … デフォルト
zoom: 0.5; … 半分に縮小
□percentage（使用したフォントのサイズを 100% として計算します）
zoom: 150%; … 1.5倍に拡大
zoom: 100%; … デフォルト
zoom: 50%; … 半分に縮小
□number
<p style="zoom: 1.5;">1.5倍ですABCDEFGHIJKLMNOPQRSTUVWXYZ</p>
<p style="zoom: 1;">デフォルトですABCDEFGHIJKLMNOPQRSTUVWXYZ</p>
<p style="zoom: 0.5;">0.5倍(半分)ですABCDEFGHIJKLMNOPQRSTUVWXYZ</p>
□percentage
<p style="zoom: 150%;">1.5倍ですABCDEFGHIJKLMNOPQRSTUVWXYZ</p>
<p style="zoom: 100%;">デフォルトですABCDEFGHIJKLMNOPQRSTUVWXYZ</p>
<p style="zoom: 50%;">0.5倍(半分)ですABCDEFGHIJKLMNOPQRSTUVWXYZ</p>
↓こんな感じですね（＾＾）
■color（文字色を指定するプロパティ）
BODY, TD, THのタグにもスタイルで色指定できますが当然段落のスタイルにも有効です。
また、HTMLタグでは色指定はカラーコードとカラーネームだけですがスタイルでは以下のように細かい指定ができます。
□color: #FF0000･･･ シャープ（ # ）で始まる6桁のカラーコードで指定 [タグと共通]
□color: red･･･ redやgreen、whiteといったカラーネームで指定 [タグと共通]
□color: #F00 シャープ･･･（ # ）で始まる3桁のカラーコードで指定
□color: rgb(255,0,0)･･･ rgb( )による指定（0～255）
□color: rgb(100%,0%,0%)･･･ rgb( )による指定（0%～100%）
ですので、ちなみに以下の五つの記述はスタイルの世界ではすべて同じ『赤』です（＾＾）
color: #FF0000
color: red
color: #F00
color: rgb(255,0,0)
color: rgb(100%,0%,0%)
いずれも各々の表示がＲＧＢを表していますので
「白」は
color: #FFFFFF
color: white
color: #FFF
color: rgb(255,255,255)
color: rgb(100%,100%,100%)
「赤」
color: #FF0000
color: red
color: #F00
color: rgb(255,0,0)
color: rgb(100%,0%,0%)
「緑」
color: #00FF00
color: green
color: #0F0
color: rgb(0,255,0)
color: rgb(0%,100%,0%)
「青」
color: #0000FF
color: blue
color: #00F
color: rgb(0,0,255)
color: rgb(0%,0%,100%)
「黒」
color: #000000
color: black
color: #000
color: rgb(0,0,0)
color: rgb(0%,0%,0%)
<p style="color: rgb(255,0,0)">赤い文字ですが「緑」や「青」の数字を変えると明るくなってきます（＠o＠）</p>
<p style="color: MediumSlateBlue">MediumSlateBlueなんて色の名前を覚えるほうが大変なのでは（＠o＠）</p>
↓こんな感じですね（＾＾）
▲CSS本来の記述方法
<style type="text/css">
<!--
P {
font-style: italic;
font-variant: normal;
font-weight: 900;
font-size: 200%;
/line-height: 2em;
font-family: sans-serif;
zoom: 1.5;
color: #00FF00
}
-->
</style>
*****************************************************
【庶事所感】
「楽天-巨人」・・・本当はまったく興味無いんです（＞＜）
なのに最後まで見てしまった。最終回大きな点差のなかで、飛び出したホームラン！なぜか感激が込み上げて、楽天がんばれ！！
ん・・・勝ったら、買い物しようと思ってただけなんですけど（＾＾）point2倍ですものね。意外と本気になってしまいましたぁ
*****************************************************
なぜか行掛かりでBlogLankingに参加しました(^^;)面白かったらポチして下さいネ
リンクはフリーですご自由にどうぞ(バナーリンクタグはprofileのページ年表欄にあります）
fontのスタイルではないのですがテキストを修飾するスタイルがいくつかあります。
スタイルシート>>フォント>>font周りのスタイル(1)
////////////////////////////////////////////////////////////////////////
■zoom（拡大を指定するプロパティ）
■color（文字色を指定するプロパティ）
■text-decoration（文字の装飾線、点滅を指定するプロパティ）
■zoom（拡大を指定するプロパティ）
zoom: 1.5; … 1.5倍に拡大
zoom: 1; … デフォルト
zoom: 0.5; … 半分に縮小
□percentage（使用したフォントのサイズを 100% として計算します）
zoom: 150%; … 1.5倍に拡大
zoom: 100%; … デフォルト
zoom: 50%; … 半分に縮小
□number
<p style="zoom: 1.5;">1.5倍ですABCDEFGHIJKLMNOPQRSTUVWXYZ</p>
<p style="zoom: 1;">デフォルトですABCDEFGHIJKLMNOPQRSTUVWXYZ</p>
<p style="zoom: 0.5;">0.5倍(半分)ですABCDEFGHIJKLMNOPQRSTUVWXYZ</p>
1.5倍ですABCDEFGHIJKLMNOPQRSTUVWXYZ
デフォルトですABCDEFGHIJKLMNOPQRSTUVWXYZ
0.5倍(半分)ですABCDEFGHIJKLMNOPQRSTUVWXYZ
□percentage
<p style="zoom: 150%;">1.5倍ですABCDEFGHIJKLMNOPQRSTUVWXYZ</p>
<p style="zoom: 100%;">デフォルトですABCDEFGHIJKLMNOPQRSTUVWXYZ</p>
<p style="zoom: 50%;">0.5倍(半分)ですABCDEFGHIJKLMNOPQRSTUVWXYZ</p>
↓こんな感じですね（＾＾）
1.5倍ですABCDEFGHIJKLMNOPQRSTUVWXYZ
デフォルトですABCDEFGHIJKLMNOPQRSTUVWXYZ
0.5倍(半分)ですABCDEFGHIJKLMNOPQRSTUVWXYZ
■color（文字色を指定するプロパティ）
BODY, TD, THのタグにもスタイルで色指定できますが当然段落のスタイルにも有効です。
また、HTMLタグでは色指定はカラーコードとカラーネームだけですがスタイルでは以下のように細かい指定ができます。
□color: #FF0000･･･ シャープ（ # ）で始まる6桁のカラーコードで指定 [タグと共通]
□color: red･･･ redやgreen、whiteといったカラーネームで指定 [タグと共通]
□color: #F00 シャープ･･･（ # ）で始まる3桁のカラーコードで指定
□color: rgb(255,0,0)･･･ rgb( )による指定（0～255）
□color: rgb(100%,0%,0%)･･･ rgb( )による指定（0%～100%）
ですので、ちなみに以下の五つの記述はスタイルの世界ではすべて同じ『赤』です（＾＾）
color: #FF0000
color: red
color: #F00
color: rgb(255,0,0)
color: rgb(100%,0%,0%)
いずれも各々の表示がＲＧＢを表していますので
「白」は
color: #FFFFFF
color: white
color: #FFF
color: rgb(255,255,255)
color: rgb(100%,100%,100%)
「赤」
color: #FF0000
color: red
color: #F00
color: rgb(255,0,0)
color: rgb(100%,0%,0%)
「緑」
color: #00FF00
color: green
color: #0F0
color: rgb(0,255,0)
color: rgb(0%,100%,0%)
「青」
color: #0000FF
color: blue
color: #00F
color: rgb(0,0,255)
color: rgb(0%,0%,100%)
「黒」
color: #000000
color: black
color: #000
color: rgb(0,0,0)
color: rgb(0%,0%,0%)
<p style="color: rgb(255,0,0)">赤い文字ですが「緑」や「青」の数字を変えると明るくなってきます（＠o＠）</p>
<p style="color: MediumSlateBlue">MediumSlateBlueなんて色の名前を覚えるほうが大変なのでは（＠o＠）</p>
↓こんな感じですね（＾＾）
赤い文字ですが「緑」や「青」の数字を変えると明るくなってきます（＠o＠）
MediumSlateBlueなんて色の名前を覚えるほうが大変なのでは（＠o＠）
▲CSS本来の記述方法
<style type="text/css">
<!--
P {
font-style: italic;
font-variant: normal;
font-weight: 900;
font-size: 200%;
/line-height: 2em;
font-family: sans-serif;
zoom: 1.5;
color: #00FF00
}
-->
</style>
*****************************************************
【庶事所感】
「楽天-巨人」・・・本当はまったく興味無いんです（＞＜）
なのに最後まで見てしまった。最終回大きな点差のなかで、飛び出したホームラン！なぜか感激が込み上げて、楽天がんばれ！！
ん・・・勝ったら、買い物しようと思ってただけなんですけど（＾＾）point2倍ですものね。意外と本気になってしまいましたぁ
*****************************************************
なぜか行掛かりで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.
