はてなダイアリーのデザインをカスタマイズしてみる（４）

はてなキーワードの下線を普段は非表示にして、マウスオーバー*1で下線を表示させるようにする。

a.keyword {
    border-bottom: 1px solid transparent;
}
a.keyword:hover {
    border-bottom: 1px solid #0acb1a;
}

元はこういう色のリンクの文字の色を変える。茶色っぽい色になります。

span.l a {
    color: #ec950f;
}

<span class="l">[http://www.isejingu.or.jp/:title=伊勢神宮]</span>

伊勢神宮

横幅いっぱいに画像を表示。

img.large {
    width: 100%;
}

横幅を黄金分割します。

img.golden {
    width: 62%;
}

<div style="text-align: center;"><img class="golden" src="https://c1.staticflickr.com/8/7393/26608424184_01b48af020_h.jpg"></div>

ブロックの半分の横幅の画像を表示。

img.half {
    width: 50%;
} 

アマゾンの商品フレームの貼り付け。

解析入門 ?(基礎数学2)

楽天の商品フレームの貼り付け。

「へんな会社」のつくり方 常識にとらわれない「はてな」の超オープン経営術 （NT　2X←） [ 近藤淳也 ]

AA（アスキーアート）の表示。

　　 ∩＿＿＿∩
　　 | ノ　　　　　 ヽ
　　/　　●　　　● |　クマ──！！
　 |　　　　( _●_)　 ミ
　彡､　　　|∪|　　､｀＼
/　＿＿　 ヽノ　/´>　 )
(＿＿＿）　　　/　(_／
　|　　　　　　 /
　|　　／＼　＼
　|　/　　　 )　 )
　∪　　　 （　 ＼
　　　　　　 ＼＿) 

引用。

引用（いんよう、英語：citation, quotation）とは、広義には、他人の著作を自己の作品のなかで紹介する行為、先人の芸術作品やその要素を自己の作品に取り入れること。報道や批評、研究などの目的で、自らの著作物に他の著作物の一部を採録したり、ポストモダン建築で過去の様式を取り込んだりすることを指す。狭義には、各国の著作権法の引用の要件を満たして行われる合法な無断転載等のこと。

https://ja.wikipedia.org/wiki/%E5%BC%95%E7%94%A8

Wikipedia記法。
wikipedia:引用

*1:スマホなどではできない。