Can a HTML 5 video tag have multiple MP4 sources with different codecs?

Question

I'm thinking about the fact that the higher the MP4 profile we go, the better the video quality gets...

This brings me to a question I thought I'd ask the experts!

Can a HTML 5 video tag have multiple MP4 sources with different codecs? Something like:

<video>
    <source src="video.webm" type='video/webm; codecs="vp8, vorbis"' />
    <source src="high.mp4" type='video/mp4; codecs="avc1.64001E, mp4a.40.2"' />
    <source src="main.mp4" type='video/mp4; codecs="avc1.4D401E, mp4a.40.2"' />
    <source src="baseline.mp4" type='video/mp4; codecs="avc1.58A01E, mp4a.40.2"' />
</video>

The first MP4 video being a high profile video, the second main profile, and the third baseline profile.

On an iPhone 3G, will the baseline one be played?

On an iPhone 4S, will the high one be played instead?

A follow up question: if the high profile video is below the baseline profile video in the source list, which one will play on an iPhone 4G?

(Thanks for reading and especially if you reply. :)

Answer 1

According to Mozilla, <video> can contain an arbitrary number of <source> tags. Also, the first source tag with a compatible video file for the current device/browser should be played.

Apple themselves confirm that the <source> tags should be in the developer's preferred fall-through order, from which I'd assume that Mobile Safari, too, will pick the first file it can play.

So, from what I was able to dig up, there is no static way of preferring a particular file for a particular browser/device combination. You'd probably have to do some detection based on the provided User Agent string and only supply the proper files (but that's not possible with plain HTML).