« シーフードヌードル+いなばタイカレー | トップページ | Calzone Mediterraneo (業務スーパー) »

2020.05.09

マイフォトのデザインをなんとかしたい(その2)

D020509

「マイフォトのデザインをなんとかしたい」の続き。

結局、何となく気に食わないという理由でコレを延々いじって、今年の“G.S.H.W.”(ゴールデンステイホームウィーク……ゴロ悪っ)は終わった。


(1) まずは、ブラウザの幅を狭めると、バナーがアルバムの名前などに被さってしまう問題については、一応の解決。
ヘッダーの左側部分とバナーの幅に上限を設定することにした。

D020509b

結果重ならなくはなったが、バナーの横幅がね…………ゴムのように伸び縮みするようになった。(笑)


D020509c

(2) アイテムボックスに背景画像を設定したら、思いのほかウザいので、背景画像の角を丸めて、“これは背景です”感を演出することにした。

でもその結果、丸めた角の部分で下地のグレーが見えちゃうんだよな。
ただ、色調が同じで、遠目で見れば全体背景の薄英文柄に埋没するみたいなので、これでいい事にする。


D020509d

(3) フッター部分の意味不明の白い線を消したり、別途背景画像を設定したりしたかったが、どうも上手くいかず、断念。


D020509e

(4) CSSを「説明文/紹介文」のところにベタ打ちしている状態では、やっぱものすごく見辛いので、別途CSSファイルを作成、@niftyがオマケで付けてくれているWebサーバー(LaCoocan…ラ・クーカン、楽空間?名称ダサww)に保存。
それを「説明文/紹介文」から呼び出すことにした。

CSSファイルは3種類作ってみた。
背景画像と色を変更しただけだが。

D020509f
orange

D020509g
blue

D020509h
green

飽きたのでこれにて終了。


***参考にされる奇特な方へ***

http://kahou.life.coocan.jp/blogjs/orange.css
http://kahou.life.coocan.jp/blogjs/blue.css
http://kahou.life.coocan.jp/blogjs/green.css

それぞれCSSファイルはココに入ってマス。↑
ダウンロードして使いたい場合は、右クリックメニューから「リンク先を保存」などで対応してください。

<link rel="stylesheet" href="http://kahou.life.coocan.jp/blogjs/orange.css" type="text/css" /><A class="kahou" HREF="http://kahou.way-nifty.com/"><IMG SRC="https://kahou.way-nifty.com/photos/cg/bannerlogo.gif"></A>

「説明文/紹介文」に埋め込んでいるタグはこんな感じ。コピペでどうぞ。

尚、画像ファイルなどはご自身で用意して、CSSファイルの中やタグのリンク先を必ず変更して使って下さい。(言わなくてもそうすると思うけど。)
気まぐれにリンク先の画像ファイルを変更したり削除したりしますので、その時そのまま使っていると必ず破綻します。

|

« シーフードヌードル+いなばタイカレー | トップページ | Calzone Mediterraneo (業務スーパー) »

テクノロジ」カテゴリの記事