オープンソースの画像生成AIをセットアップから使い方まで解説する『Stable Diffusion AI画像生成ガイドブック』(ソシム刊)発売中(→本のサポートページ

aboutページのISBN/ASIN画像に、こんなCSS

【元記事:aboutページのISBN/ASIN画像に、こんなCSSd:id:manpukuya:20041015:profile2

[画像:「?」の変化]上記の通り、aboutページに「最近言及したISBN/ASIN」も表示できるようになった。ここでは、商品に画像がない場合、代わりに「?」の画像が表示される。

しかしこの画像、「?」の周囲が透過指定になっており、ページの背景色によってはちょっと見づらい。そこで、下のように指定してみた。

img.hatena-profile-image { /*aboutページの「最近言及した〜」の画像に*/
background-color:#fff;     /*背景色を白く指定*/
border:solid 1px #ddd;     /*灰色で太さ1ピクセルの枠線を指定*/
}

すると、画像の背景色が白くなり、灰色の枠線で囲まれるようになった。けっこう見やすくなったのではないだろうか。色は「#fff」や「#ddd」で指定しているので、ここを変えると背景色や枠線の色を変更できる。