A.T-MOON

contents

パンくずリスト



    フォントの装飾A(スタイルシート編)

スタイルシートを使ってフォントの指定をします。
<head>〜</head>の間に挿入して使う埋め込みスタイルシートと
<body>〜</body>の間の表示させたい部分に挿入するインラインスタイルシートがあります。
又、要素によってどの部分を指定するのかが変わってきます。

これらの他にもHTMLタグを使っての文字の装飾、JavaScriptを使っての文字の装飾がありますので
それぞれ参考にしてみて下さい。


マーク 文字に影をつける

    A{width=100%; filter:dropshadow(color=B,offX=2,offY=2);}
 もしくは
    <A style="width=100%; filter:dropshadow(color=B,offX=2,offY=2);>


Aには【p】や【div】、【span】などの範囲を指定する要素タグを記述します。
Bには影の色のカラーネームやカラーコードを挿入します。

ページ全体
青色にピンクの影付き文字

<head>〜</head>の間に

<body>〜</body>内に記述される文字が指定された【青色にピンクの影付き】で表示されます。

指定した部分(埋め込み)
茶色にシルバーの影付き文字

<head>〜</head>の間に


<body>〜</body>の表示したいところに


指定した部分(インライン)
赤色にグレイの影付き文字

<body>〜</body>の間の表示したい部分に挿入します。

ページTOP


マーク 文字を発光させる

    A{width=100%;filter:glow(color=B,strength=5);}
 もしくは
    <A style="width=100%;filter:glow(color==B,strength=5)">


Aには【p】や【div】、【span】などの範囲を指定する要素タグを記述します。
Bには発光色のカラーネームやカラーコードを挿入します。

ページ全体
青色の文字を水色で発光せる

<head>〜</head>の間に

<body>〜</body>内に記述される文字が指定された【青色の文字を水色で発光】で表示されます。

指定した部分(埋め込み)
茶色の文字をシルバーで発光せる

<head>〜</head>の間に


<body>〜</body>の表示したいところに


指定した部分(インライン)
赤色の文字をグレイで発光させる

<body>〜</body>の間の表示したい部分に挿入します。

ページTOP


マーク 文字をかすれさせる

    A{width=100%;filter:shadow(color=B,direction=120,strength=3);}
 もしくは
    <A style="width=100%;filter:shadow(color==B,direction=120,strength=3)">


Aには【p】や【div】、【span】などの範囲を指定する要素タグを記述します。
Bにはかすれる色のカラーネームやカラーコードを挿入します。

ページ全体
青色の文字を水色でかすれさせる

<head>〜</head>の間に

<body>〜</body>内に記述される文字が指定された【青色の文字を水色でかすれさせる】で表示されます。

指定した部分(埋め込み)
ピンク色の文字を薄いピンク色でかすれさせる

<head>〜</head>の間に


<body>〜</body>の表示したいところに


指定した部分(インライン)
赤色の文字をグレイでかすれさせる

<body>〜</body>の間の表示したい部分に挿入します。

ページTOP


フォントの装飾@(スタイルシート編) フォントの装飾B(スタイルシート編)