life

【ここで躓いた!】VScoadで画像を貼る方法(Windows10版)

VScoadで画像が貼れなくて困っている

もう諦めて寝ようかなぁ、誰か助けて欲しい!

 

この記事を読めば、『VScoadに画像が貼れない』悩みを解決できます。

 

躓いたポイントをメモ的に残しつつ共有します。なぜなら、私はVScoadに画像を貼るのに9時間もかかったからです。結論から書きます。

 

結論、VScoadに画像が貼れました。

 

パソコンはWindows10で、短く分かりやすく解説していきます。


 

 

上記の内容で解説していきます。

 

1.デスクトップに新規フォルダ―を作成する

 

デスクトップで右クリックをし新規作成フォルダーで『image-test』を作ります。

 

 

つぎに『image-test』をクリックします。

 

2.1で作成したフォルダーの中に新規フォルダーを作成する

 

空のフォルダー画面で右クリックし、新規作成→フォルダーをクリックします。

 

 

フォルダー名を『img』で作成します。

 

3.2で作成したフォルダーに表示したい画像をドラッグ&ドロップで移動させる

 

取り込みたい画像は、あらかじめデスクトップに置いておくと作業がスムーズです。

 

2.で作成したフォルダーに取り込みたい画像をドラック&ドロップで移動します。

 

4.デスクトップに作ったフォルダーをドラッグ&ドロップでVScoadの画面に移動させる

 

デスクトップに作成した『image-test』をVScoadにドラック&ドロップで移動します。

 

 

すると上記の画像のようになります。

 

あと少しで完成です。

ちょい長くなってきましたが、休憩せずに一気にいきましょう。


 

 

VScoadのエディターを開くと『image-test』が表示されています。

 

 

つぎに『新規ファイル』から『index.html』ファイルを作成します。

 

 

『index.html』に書くコードは上記のとおりです。書いたら一旦保存します。Windows10は『 Ctrl』+『S』で保存できます。

 

 

つぎに画像の『IMG2323.JPG』を右クリックし名前を変更します。

 

 

『名前の変更』をクリックし『image.jpg』に変更します。モデルは我が家の猫です。

 

 

☑️あと3つだけです!

デスクトップに作成した『image-test』をクリックし、開いたフォルダーの『img』をクリックします。

 

 

さらに開いたフォルダーの『img』をクリックします。

 

 

お疲れ様でした。VScoadの画像貼り付け完了です。どうでしょうか、上手くいきましたかね。

 

今回は以上です。


-life
-,

© 2022 monakote.blog Powered by AFFINGER5