プロ野球記事用はてなブログ向けチームごとのCSSとタグのソース

www.akunohosomichi.com

前回の記事において球団ごとに色と背景をつけるＣＳＳをぶち込みましたが
ここでそのソースコードを公開しようと思います。

はてなブログデザイン用ＣＳＳコード

背景形状用コード

back-logoクラスで背景の形を形成します。

.back-logo{
     display:inline-block;
     padding : 0 5px;
     border-radius:6px;
     }

チーム設定用カラーリング

球団のカラーはこちらで参考にさせていただきました。

ayaito.net

日本のプロ野球は基本アルファベット略称は一文字ないし二文字ですが、
クラスとして使うには何かと逆に使いにくいので
私はメジャーリーグ式のアルファベット三文字にしています。

/*spanプロ野球チーム設定用*/
/*阪神*/
.han{
     background-color:#FFe201;
     font-weight:bold;
     }
/*中日*/
.chu{
     background-color:#002596;
     color:#FFF;
     font-weight:bold;
    }
/*広島*/
.hir{
     background-color:#F00;
     color:#FFF;
     font-weight:bold;
     }
/*横浜DeNA*/
.yok{
     background-color:#0067ff;
     color:#FFF;
     font-weight:bold;
     }
/*東京ヤクルト*/
.yak{
     background-color:#98c145;
     color:#0f1350;
     font-weight:bold;
     }
/*読売巨人*/
.yom{
     background-color:#F97709;
     color:#000;
     font-weight:bold;
     }
/*日ハム*/
.hok{
     background-color:#e1a823;
     color:#02518c;
     font-weight:bold;
     }
/*東北楽天*/
.toh{
     background-color:#85010f;
     color:#F8aa0c;
     font-weight:bold;
     }
/*埼玉西武*/
.sai{
     background-color:#102961;
     color:#FFF;
     font-weight:bold;
     }
/*千葉ロッテ*/
.chi{
     background-color:#999;
     color:#000;
     font-weight:bold;
     }
/*オリックス*/
.ori{
     background-color:#000;
     color:#b08f32;
     font-weight:bold;
     }
/*福岡ソフトバンク*/
.fuk{
     background-color:#f9ca00;
     color:#000;
     font-weight:bold
     }

     

はてな表記で行うタグ付け

はてな記法などで

<span class="back-logo チームに設定したクラス ">チーム</span>

とします。

ユーザー辞書などでこの型を登録しておくといいでしょう。

実際の使用例

阪神 3-0 巨人

本日は完封でした。