ブログ画像のＵＲＬが分りません

実は…ブログ画像と言っても
ブログ本文等に貼ってある画像って意味じゃないんで
そう思われた方、申し訳ありません

実は、下記ブログの１番上に表示されてる
画像でＵＲＬが分らないんです
つまりタイトルが書かれてる画像という意味です
http://ameblo.jp/yua-shinkawa/
http://ameblo.jp/mariya-ameblo/

通常なら右クリックから
「名前を付けて画像を保存」で出来るんですが
この場合、右クリックしても
「名前を付けてリンク先を保存」しか出て来ません

更に、ページのソースから見ようかとも思ったんですが
このソースに関しては、まだ知識が浅いからでしょう
それらしき物が見つけられませんでした

そこで聞きたいんですが、この様な画像のＵＲＬは
どうやったら分るんでしょうか？
実は、私の場合自分でもブログを作ってるんですが

自分のブログでも、画像を似た様な状態で作っており
随分昔に作ったもんで、そのＵＲＬも見つけられない為
ある意味応用と思い、質問しました

No.3 ベストアンサー 回答者： mikinon 回答日時： 2012/09/21 15:52

ソースの中にはタイトル画像のアドレスは書かれていないのです。

テンプレートのCSSの中に書かれています。
ページソース（HTML)とCSSは別ものです。
ただし、ソースの中に、CSSのアドレスが書かれています。

ですから、まずソースを見て、テンプレートCSSのアドレスが書かれているところ探します。
で、amabaの場合、テンプレートCSSのアドレスは
http://usrcss.ameblo.jp/skin/templates/********* … です。

で、ここからですが、CSSを開きます。firefoxでしたら、そのままCSSの部分をクリックすれば開けると思います。
そこから、ヘッダー部分（タイトル画像）のアドレスを探すことになります。

ソースの中からbackground:を探すのではなく、CSSの中から探してください。
background:よりも#header探したほうが見つかりやすいかと思います。

この回答へのお礼

回答有難う御座います

“ページソース（HTML)とCSSは別ものです。”
ハイ…詳細迄は把握してませんが
別物だという事迄は知ってました

ただ、今回の件は結論から言うと成功しました

まず今回教えて頂いたブログのＵＲＬに関しても
テンプレートCSSのアドレスが見つかり
そのＵＲＬをクリックすると画面が切り替わりました

そしてヘッダーって言いましたか？
検索を使用して、#header{を入れ
そこからバックグランドを見つけ
その画像ＵＲＬをブラウザに貼り付けたら
前回の回答でアップして頂いた画像ＵＲＬが出ました

そこで…今度は、もう１つのアメブロで試した所
これも問題無く画像ＵＲＬを見つけられました

ただ…御指摘のＵＲＬと少し違ったのが
御指摘のＵＲＬでは
#header{
background:transparent url
でＵＲＬが出て来ました

しかし、もう１つの方は
#header{
background:url
とtransparentの文字が入ってなかったんですが
それでもＵＲＬをブラウザに貼り付けると
問題無くトップの画像が出て来たんで成功したと判断しました

ただ…ここで、もう１つ質問します
これは私の今後の勉強として…なんですが
今回のアメブロのＵＲＬは教えて頂きました
従って、今後アメブロで似た様な事だったら分るだろうと思います

しかし、問題(？)なのは
今後違うブログやＨＰで同じ様な物を見つけた場合なんですが
これは、どうやって見つければ良いか？…
つまり、見つけるポイントは何か？…という事です

今回の場合で例えると、私は最初の回答から
<link rel="stylesheet" media="screen,print" type="text/css" href="http://usrcss.ameblo.jp/skin/templates/fe/a4/100 … charset="UTF-8" />

の中で、link relの項目内で"stylesheet""screen,print""text/css" の３つに注目
それが共通する行(？)で/skin/templates/の文字が入ってる物…
そう推測してました

しかし、今回の回答では
http://usrcss.ameblo.jp/skin/templates/********* …
との御指摘で、/skin/templates/に注目しました

ただ…これはアメブロでの設定で
他のブログやＨＰでは違って来ると思います

そこで聞きたいのが、これらで共通するポイントは何かという事
あるいは、それらを解説してるＨＰ等を御存知なら
それを教えて頂くか？又は、それらを見つけるには
どんな言葉で検索すればヒットし易いかを教えて頂けないでしょうか？

お礼日時：2012/09/22 13:19

No.2 回答者： kiyoto-777 回答日時： 2012/09/21 09:42

1.ヘッダー画像の多くは背景画像なので、右クリックしても画像のＵＲＬは

調べられません。

2.背景画像のＵＲＬを知るには、ＣＳＳファイルの中身を見て確認する。

3.デザインするなら、FireFoxのブラウザでFirebugのアドオンを入れれば
右クリックしてFirebugで要素を調査すれば、その部分の
ＣＳＳ、ＨＴＭＬがすべて表示されます。

4.ＩＥでもF12を押して開発者ツールを開いて開発者ツールのツール部分の
矢印（左斜め上に向いている矢印）をクリックしてページの調べたい
部分をクリックすれば表示されますが、使い方は難しいと思います。

5.FireFoxのブラウザは無料です。１つのＰＣに複数のブラウザを入れられます。
同時に動かせます。Firebugも無料です。

6.Firebugのアドオン（プラグイン）はFirefox以外に、IEやクロームの
ブラウザ用のものもありますが、FireFoxのFirebugが一番使いやすい

この回答へのお礼

回答有難う御座います

勝手に関係無いだろうと判断して書かなかったんですが
ブラウザにはＦｉｒｅｆｏｘを使用してます

ただ…御指摘のアドオンを調べましたが
現在私は古いバージョンを使用しておりいれられませんでした
バージョンは９なんですが、これに合うバージョンは
存在するでしょうか？

バージョンをアップさせてない理由は
以前にバージョンアップさせた時
ブラウザが重くかった為に戻したからで
但し、いつ迄も古いバージョンを使用出来る訳じゃないんで
近いウチに変える予定ですが
思い理由や解決方法に関しては、長文の恐れが考えれるんで
ここではカットさせて頂きます

それと…これはアドオンで見てからの話だと思いますが
そのアドオンが無しの場合、やはりＣＳＳ等を見つけるのは大変ですか？

お礼日時：2012/09/21 12:54

No.1 回答者： mikinon 回答日時： 2012/09/20 17:34

自分のブログならCSSを確認すれば、すぐ分かります。

他の人のものでも、ページのソースを見て、CSSを見ればわかります。

http://ameblo.jp/yua-shinkawa/
ですと、ソースからテンプレートのCSSを探します。
21行目
<link rel="stylesheet" media="screen,print" type="text/css" href="http://usrcss.ameblo.jp/skin/templates/fe/a4/100 … charset="UTF-8" />
とあります。
http://usrcss.ameblo.jp/skin/templates/fe/a4/100 …
がテンプレートのCSSになります。

CSSをみて、#header部分のbackground:を探します。
/* ---------- header : ブログタイトル部分 ----- */
#header{
background:transparent url(http://stat100.ameba.jp/p_skin/official_a/yua-sh … no-repeat scroll center top;
とありますので、
画像のURLは
http://stat100.ameba.jp/p_skin/official_a/yua-sh …

この回答へのお礼

回答有難う御座います

ただ…申し訳ありません
言われてる事は何となく分ったんですが

まずテンプレートのCSSを探すと書かれてますが
これは、どういう理由からですか？
と言うのも、そこから
“#header部分のbackground:を探します”
と書かれてるんですが、その探したＵＲＬには
テンプレートＵＲＬ(？)の文字が判断出来ないんです

つまり、テンプレートのCSSでは
http://usrcss.ameblo.jp/skin/templates/fe/a4/100 …
と書かれてますが、画像のＵＲＬでは
http://stat100.ameba.jp/p_skin/official_a/yua-sh …
と書かれており、共通する部分は
.ameblo.jp/skin/の部分しか無いですが
これが該当する部分を探せという事でしょうか？

それと
“#header部分のbackground:を探します。”
と書かれてますが
これは、どうやったら簡単(？)に見つかるでしょうか？

と言うのも、全ソースを見たんでは莫大なタグ等の量の為
ソースをメモ帳に貼り付け
background:で検索したんですが全くヒットしなかったんです

お礼日時：2012/09/20 18:38