最近HTMLの勉強をはじめたのですが、その中で、自分のマイドキュメントのなかのMyPicturesにある画像を取り込むときに、<img border="0" src=file:///C:/My%20Documents/My%20Pictures/ichigopafe.gif この後に大きさとなっているのですが、「%20って」どういう意味ですか?それから、C:の前の///の意味を教えて下さい。まだ初心者なのでよろしくお願いします。

このQ&Aに関連する最新のQ&A

A 回答 (4件)

簡単に説明すると、サーバ上に作成するサイトをbudouajiさんのPC上に再現するわけです。



ディレクトリ構造

C:\ <コンピュータのルートディレクトリ

...-home <Webページのルートディレクトリ
......|
........--contents <htmlファイルを格納
......|
........--image <画像ファイルを格納
......|
........--sound <音声ファイルを格納

など、格納するファイルの種類によってディレクトリを分けると管理しやすくなります。
また、「contents」ディレクトリの中を更に分けて、プロフィールやリンク等のコンテンツ毎にしておくと、これまたファイル管理がしやすくなります。

そして、Webページで扱うファイルは、全て「home」以下のディレクトリに保存しておくことです。
(外部リンクを除く)

リンクについては、現在の場所からの相対的な位置関係で表す「相対パス」にしておきましょう。
    • good
    • 0

こんにちは。


sesame さんへのお礼にある、>それを見ながらペイントで作成~ってのは、多分、メモ帳の間違いでしょうか?

実は、私も同じ事やってます。但し元をつくったのはフロントページじゃなくて、ネットスケープコンポーザーですけど。(^^ゞ

最近は、HTMLの単語(タグといいます)を結構覚えてきたので、最初からメモ帳だけで書けるようになりましたけど。

そうやって、この程度のことは出来るようになります。↓(参考URL)

それから、>半角スペースをふくまない~っていうのは、インターネットでは、フォルダ(ディレクトリといいます)やファイル名は、半角英数文字しか
使えません。ですから、半角カタカナや半角スペースもダメです。

まず、使うファイルの名前等を全部、半角英数字に直しましょう。
それから、大文字と小文字も区別されるので、どちらかに統一した方がいいです。

例えば、
富士山.jpg → ×
fujisan.jpg → ○

あと、実際のファイル名が Fujisan.jpg で HTMLに fujisan.jpg ってやるとパソコンの中にある時は表示されるけど、インターネットのサーバーにアップロードすると見えなくなっちゃいます。

だから、>半角スペースをふくまないフォルダ~というのは、どこかにあるんじゃなくて、フォルダの名前を変えて作っちゃうんです。

ファイル名も同様に。全て半角英数字だけ。これを忘れずに。

ではお互いに頑張りましょう。

参考URL:http://www13.u-page.so-net.ne.jp/zd5/gonbe7/
    • good
    • 0
この回答へのお礼

親切に教えてくださってありがとうございます。そうそうペイントじゃなくて、メモ帳です。すいません。意味が少し分かりましたよ。そういう意味だったんですね。ありがとうございました。それからホームページ見させてもらいました。早くみなさんみたいに作れるように頑張ります。

お礼日時:2001/07/30 19:29

%20は半角スペースの代替参照です。


My%20Documents/My%20PicturesならMy Documents/My Picturesと置きかえられます。
file:///はローカルドライブ(自分のマシン)内のファイルをURL指定する場合の書式です。

なお、
<img border="0" src=file:///C:/My%20Documents/My%20Pictures/ichigopafe.gif>
と記述したHTMLは、サーバスペースにアップロードしても「絶対に」正しく表示されませんので、今のうちにちょこちょこ直しておきましょう。
正しい書式は
<img border="0" src="ichigopafe.gif" width="" height="">
です。(width="" height=""には画像の縦横サイズを記入する)
また、HTMLに対して画像フォルダを掘ってその中に画像をまとめて格納するならば、
<img border="0" src="./images/ichigopafe.gif" width="" height="">
等となります。(フォルダ名はimagesでなくても任意)

注意事項としては、
・あなたのマシンのドライブ/フォルダ構成はサーバ上では再現できないので、file:///…で始まるローカル指定は捨て去りましょう。
・半角スペースを含むフォルダ内でのHTML編集は、正しい動作が保証できないので、ドライブのルートから半角スペースを含まないフォルダを掘って、そこで編集するようにしましょう。
(C:\HTML\ 、C:\MYHOME\ など)
    • good
    • 0
この回答へのお礼

詳しく説明していただいてありがとうございます。私のソースが間違ってるって知らなかったです。そもそもフロントページってマイクロソフトのホームページを作成するソフトがありますよね。それを見ながらペイントで作成してるんですけど、フロントページのソースをまねしてもだめなんですか?そういうことじゃないのかな。私の場合画像を保存してる場所が悪いってことなんですか?半角スペースを含まないフォルダっていったいどこなんですか。右も左もまだ分かってないので、良かったら教えてください。

お礼日時:2001/07/30 16:56

根本的にあなたのソースの指定方法が間違っています。

これではweb上にアップしたときにあなた以外画像ファイルはみられません。相対パスで指定するようにしましょう。絶対パス・相対パスに関してはHTMLリファレンスの本などをみれば載っていることですので今一度お確かめください。
では。

参考URL:http://tohoho.wakusei.ne.jp/www.htm
    • good
    • 0
この回答へのお礼

さっそくありがとうございます。な、何と私のソースが基本的に違ってるってことですよね。なんせまったくのど素人なので、何が何だか。でも頑張って勉強して見ます。ありがとうございます。

お礼日時:2001/07/30 16:49

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aと関連する良く見られている質問

Qcss:リンク画像の枠消し: a img { border:none} にしてもダメ

リンク画像に、【テキストリンクと同じスタイル】つまりリンクの背景色や枠線が適用されてしまい、困っています。

下のように、entry-bodyというクラスの a を打ち消す a img のスタイルを指定しているのですが…。(色番号は長くなるので#だけにしています)a:visited img や a:hover img も同様に指定しています。また、.entry-body img には、他のスタイル指定をしていません。

どなたかお分かりになったら助けてください!

.entry-body a { color:#; background-color:#; border-bottom:1px #;}

.entry-body a img { background-color:transparent; border-bottom:none;}

Aベストアンサー

だいぶ端折って書きますが・・・。
こちらの環境firefox2
【引用開始】
<body>

<p class="entry-body">
<a href="#">hogehgeohgoe</a>

ぱたーんいち<a href="#">abc<img src="hogege.gif">def</a><br>
ぱたーんに<a href="#"><img src="hogege.gif"></a>

</p>
</body>
【引用終り】

もし「ぱたーんいち」のようにhtmlを書いているのでしたら、abcdefの部分に<a>に設定したcssが適用されます。<a><a/>の間に<img>ありますので・・・。「ぱたーんに」なら少なくとも背景については表示されないはずです。

Q←これをCSSでやりたい

製作しているサイトに小さい画像が沢山あります。
今までは<img src="00.gif" border="0">と普通に書いていたんですが、
なにせ画像の数が多いのでいちいち記述すると見直す際に見にくくて邪魔なんです。

この部分のborder="0"をCSSで記述し 、一括で各イメージのボーダーを0pxにする方法って何かありますか?

もちろんborder="5"と記述したらボーダーが5pxになります。

以上宜しく教えて下さい。

Aベストアンサー

img {border: none; }

Qで出る枠

を消すにはどうしたらいいのでしょうか?

Aベストアンサー

<a><img src="x.gif" border="0"></a>
で大丈夫だとおもいます。

Q画像のUPすると「"file:///c:/~」で始まってしまう

 HPを作成中の初心者です。いろいろな方の「HTMLの書き方」を参照してnotepadでHTMLタグを勉強しながら手書きで作成しています。

 自分のHPに画像とリンクを張ろうと、リンクバナーの画像を自分のサーバーにアップしたのですが、画像のURLが「"file:///c:/~」で始まるものになってしまいます。
  
 画像をUPするとき↓のように

<IMG SRC="C:\Documents and Settings\○○\My Documents\rinku\ファイル名.gif">
 
としていました。
 他の質問を参照にすると、これでは自分のPCのファイルを参照することになってしまう・・ということはわかりました。
 そこで、対処方として「HTMLを手書きで直す」とあるのですが、どのように書き直していいのかがわかりません。

 初歩的な質問で恐縮です。HTML勉強中ですので、わかりやすく教えていただけませんでしょうか??

 ちなみにFFFTPを使ってUPしてます。

Aベストアンサー

file~から始まるということは画像のパス(指定先)が間違っているんでしょう。
回答者皆さんがおっしゃっている根本的なことをご理解されていないようですね。
file~やhttp:~は絶対パスと呼ばれ「その場所」をしているということです。file~は自分のパソコン内を指定しているわけですからあなた以外のパソコンでは画像自体が存在しないわけですから見られません。
そうなると相対パスという形でそのファイルからリンク先のものがどこに存在するかを指定してあげる方法でリンクを作り、またその通りにファイルをアップすることで自分以外の人も画像が見られるようになるわけです。
#すべてhttpではじまるアップロードした状態の
#URLを指定する方法もありますがファイル数が
#増えると管理は大変ですし、第一サーバを移す
#ときには全て書き換える羽目になり大変面倒で
#すから絶対パスでの指定、よほど理由がない限
#りやめたほうがいいです。

下記のようにディレクトリ構造がなっているとしましょう。(どんな風にファイルがおいてあるかということです)
*sozaiはディレクトリ(フォルダ)
(例1)
index.html(画像のリンクを張りたいページ)

sozai / picture.gif(ページに表示させたい画像)

<IMG SRC="/sozai/picture.gif">
*意味は「画像はindex.htmlファイルから見てsozaiディレクトリの中にある」ということです。
(例2)
picture.gif(ページに表示させたい画像)

file / link.html(画像のリンクを張りたいページ)

<IMG SRC="../picture.gif">
*意味は「画像はlink.htmlファイルから見て階層をひとつあがったところにある」といった感じです。

説明が下手で申し訳ないのですが・・・その辺りの確認をされているようには補足を読んでいる限りないようなので・・・。
これからページを増やしていくつもりならパスの指定の仕方は覚えておくべき事柄のひとつです。勉強しているならはじめのほうに出てくることのはずですが・・・。何かあれば補足ください。

file~から始まるということは画像のパス(指定先)が間違っているんでしょう。
回答者皆さんがおっしゃっている根本的なことをご理解されていないようですね。
file~やhttp:~は絶対パスと呼ばれ「その場所」をしているということです。file~は自分のパソコン内を指定しているわけですからあなた以外のパソコンでは画像自体が存在しないわけですから見られません。
そうなると相対パスという形でそのファイルからリンク先のものがどこに存在するかを指定してあげる方法でリンクを作り、またその通りにファイル...続きを読む


このカテゴリの人気Q&Aランキング

おすすめ情報