POSITISM

適度に適当に。

07« 2017.08 »09
S M T W T F S
- - 1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30 31 - -

スポンサーサイト


スポンサー広告

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

シャル・ウィ・タグ?


エッセイ

何度かカスタマイズチックな事を書いてきたりする訳ですが

■POSITISMのフッター紹介とか

■今までのカスタマイズ遍歴とか


今回は【オリジナルのタグを作ろう】みたいな話です。



興味がある方は続きからどんぞー。

やぁ!君なら来てくれると信じてたよ!

僕の名前はしのm・・(右フックをかわしながら)

そう何度も殴られるとおもっばっ・・・(返しの裏拳を食らいながら)


さていつもの殴られ妄想も完了したので(やる必要あるのか?)

さっそく【オリジナルのタグを作ろう】の話に入ります。



まず前提条件としてなんですが

【CSS】を編集する事が出来るブログサービスが対象となります。
(厳密に言えばHTMLが編集出来れば可能ですが、今回は省きます。)


まずはね【CSS】って何?

ってとこからなんですけど

コイツは【スタイルシート】と呼ばれます。
(正式名称:Cascading Style Sheets)

これはですね、要するに服です。オシャレな服。

そう考えるとHTMLは身体です。ボデー。



普段インターネットで表示されているものを目にする場合

HTMLという身体にCSSという服を着たものを見ている訳です。




で、【オリジナルのタグ】を作る訳ですが

上記の例で言うのであれば【アクセサリー】を作るイメージです。


たまに綺麗なネックレスや時計などでオシャレしたくなりません?

そういった着飾る時のアクセントになるような装飾品を作っておけば

今日はコートにカバンと靴をコーディネイトしちゃう!

とか出来る訳です。



【オリジナルのタグ】を作ると何か良い事あるの?

まず、あなたのブログがオリジナリティという輝きを放ちます。

かつ、その装飾を設定するのが簡単です。



要するに簡単にオリジナリティをアピールできる訳です!



どうですか?奥さん。

悪い話じゃないでしょう?

奥さんが10人に売れば、その10人がまた10人に売るだけで

奥さんのヘソクリもどんどん増やせるって訳ですよ。




じゃぁ、どんな装飾が出来るのよ?

って事ですが、うちで言うと良く見受けられるそれぞれの台詞


私「この青色文字とか」


でいくと実際には



‹span class="titi"›ここに任意の文字‹/span›




とだけ書いてます。

この「titi」って部分を「haha」「musume」「musume2」とすると
(若干名称があれですが・・・)

■これは嫁の発言用
■これはあーさん発言用
■これはちぃさん発言用

というようになります。

そう【オリジナルのタグ】とはこういうのを言います。

でも、皆さんの記事に

‹span class="titi"›ここに任意の文字‹/span›

↑を入力しても何も変わらない訳です。


この部分が【CSS】に設定されている訳です。

【CSS】内に「titi」という名前で装飾内容を設定すれば

‹span class="titi"›ここに任意の文字‹/span›

↑これを入力するだけで設定された装飾内容がすべて反映されます。



まぁ、習うより慣れろの精神で

1つ簡単なのを作ってみましょうか。



ブログの【CSS】を編集します。

まず【CSS】を編集する画面で内容を全てコピーしましょう。

メモ帳を起動して貼り付けます。
(Windowsであればスタート→すべてのプログラム→アクセサリ→メモ帳)

メモ帳の左上にある「ファイル」から「名前を付けて保存」を選択

名前を「元CSS.txt」で保存。


保存が完了したら、再度「名前を付けて保存」を選択し

名前を「新CSS.txt」として保存します。

※CSSファイルを変更する事でブログのデザイン等が
 大きく崩れたりしてしまった場合に「元CSS.txt」を貼り付ければ
 元通りに出来る為の措置です。



「新CSS.txt」を編集していきます。

初めて見た方は何が書いてあるのかチンプンカンプンだと思いますが

そんな事はまったく気にせずに

一番下に改行をいくつか入れて

以下の内容をコピー&ペースト(貼り付け)してみて下さい。


/* ■オリジナルタグ■ */
.tagutagu{
color:#ff0000;
font-size:20px;
font-weight:bold;
}



ペーストが完了したら「新CSS.txt」の内容を全てコピーして

ブログの管理画面にある【CSS】の編集画面に【CSS】を全て消し

空白になった部分に貼り付けます。


で保存。



これでオリジナルタグの登録は完了してます。

次は実際に使ってみましょう。



記事を作成します。

その記事内に



‹span class="tagutagu"›ここに任意の文字‹/span›




↑と入力して保存すると↓



ここに任意の文字




と表示されると思います。


で、【CSS】に設定した内容の詳細説明をすると


/* ■オリジナルタグ■ */ ←/* 説明文 */
.tagutagu{       ←タグの名前(class="ここに入ります")
color:#ff0000;   ←文字の色
font-size:20px;   ←文字のサイズ
font-weight:bold;  ←文字を太字に設定
}



という設定内容になっているのでした。

もちろん設定できる内容はもっと多くて

背景に画像を置いたり、枠線を付けてみたりと色々出来ます。

ここから先は皆さんが独自に工夫して装飾してみて下さいませ。



※解り辛かったらごめんちゃい。


ちなみにコイツもオリジナルタグなのですよ。

COMMENT

●KIHIROさん

あ、勉強になりました?
じゃ、授業料って事で過去の失態ベスト3を発表して下さい。(なぜだ)


●せんべいさん

知ったかぶりした事によって受ける損害等は
「POSITISM」は関与致しません。(業務的w)

ふむふむ。
HTMLがボディで、CSSが洋服、なんですね。
(その説明、初心者にもわかりやすいです)

今度、友達に知ったかぶりしてみようっと!
(突っ込まれたら化けの皮が剥がれるけど)

勉強になりますた(・∀・)
ブログやってないけど知識の一つとして覚えておきます(*´¬`)

FC2Ad

  [D]esigned by 218*
Copyright c POSITISM All Rights Reserved.

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。