komoto / エンジニアブログ

プログラミングについてアウトプットします。

【Markdown】はてなブログのMarkdownでソースコードのタイトルを付ける

はてなブログとQiitaでいくつか記事を書いていて思ったのが、
Qiitaだと ```python:tilte.py```ソースコードを囲めば、タイトルを付けられるのですが、はてなブログだと付かないこと。

なので、はてなブログMarkdownを使うときにソースコードにタイトルを付ける方法を調べてみました。

そしたら、すでにCSSで実装してくださっている方がおられましたので、その方の記事を載せておきます。

ちなみに実装すると次の通りQiitaのように見やすく表示されます。

5/23追記
このCSSが正常に動作するのは、PCで見るときです。
スマホで確認しましたが、スマホですとタイトルは表示できないみたいです。
お気を付けください。

print('Hello World')

itouuuuuuuuu.hatenablog.com