最新のWeb開発のチュートリアル
 

HTML src Attribute


定義と使用法

src属性は、外部リソースの場所(URL)を指定します。


に適用されます

src属性には、次の要素で使用することができます。

要素 属性
<audio> src
<embed> src
<iframe> src
<img> src
<input> src
<script> src
<source> src
<track> src
<video> src

Audio

オーディオプレーヤー:

<audio src="horse.ogg" controls>
Your browser does not support the audio element.
</audio>
»それを自分で試してみてください

Embed

埋め込まれたフラッシュアニメーション:

<embed src="helloworld.swf">
»それを自分で試してみてください

Iframe

<iframe>最も簡単な使用中:

<iframe src="/default.html"></iframe>
»それを自分で試してみてください

Img

次のように画像がマークアップされます:

<img src="smiley.gif" alt="Smiley face">
»それを自分で試してみてください

Input

送信ボタンを表す画像とHTMLフォーム:

<form action="demo_form.asp">
  First name: <input type="text" name="fname"><br>
  <input type="image" src="submit.gif" alt="Submit">
</form>
»それを自分で試してみてください

Script

外部JavaScriptファイルへのポイント:

<script src="myscripts.js"></script>
»それを自分で試してみてください

Sourceの例

2つのソースファイルとオーディオプレーヤー。 ブラウザは、それがためにサポートしているファイル(もしあれば)選択する必要があります:

<audio controls>
  <source src="horse.ogg" type="audio/ogg">
  <source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
»それを自分で試してみてください

Track

2字幕トラックとビデオ:

<video width="320" height="240" controls>
  <source src="forrest_gump.mp4" type="video/mp4">
  <source src="forrest_gump.ogg" type="video/ogg">
  <track src="subtitles_en.vtt" kind="subtitles" srclang="en" label="English">
  <track src="subtitles_no.vtt" kind="subtitles" srclang="no" label="Norwegian">
</video>

Videoの例

動画を再生します:

<video src="movie.ogg" controls>
  Your browser does not support the video tag.
</video>
»それを自分で試してみてください

ブラウザのサポート

src属性は、要素ごとに以下のブラウザのサポートを持っています。

素子
audio 4.0 9.0 3.5 4.0 10.5
embed はい はい はい はい はい
iframe はい はい はい はい はい
img はい はい はい はい はい
input 1.0 2.0 1.0 1.0 1.0
script はい はい はい はい はい
source 4.0 9.0 3.5 4.0 10.5
track 18.0 10.0 31.0 6.0 15.0
video 4.0 9.0 3.5 4.0 10.5