tryresponsive_video3 在线代码实例

 <div class="header">
        <h1>Chania</h1>
    </div>

    <div class="row">
    
        <div class="col-3 col-s-3 menu">
                <div class="col-3 col-m-3 menu">
                    <ul>
                        <li>航班</li>
                        <li>城市</li>
                        <li>岛屿</li>
                        <li>食物</li>
                    </ul>
                </div>
        </div>
    
        <div class="col-6 col-s-9">
            <h1>城市</h1>
            <p>查尼亚是克里特岛查尼亚地区的首府. 这个城市可以分为两部分，老城区和现代城区.</p>
            <video width="400" controls="">
              <source src="/statics/demosource/mov_bbb.mp4" type="video/mp4">
              <source src="/statics/demosource/mov_bbb.ogg" type="video/ogg">
              您的浏览器不支持HTML5视频.
            </video>
        </div>
        
        <div class="col-3 col-s-12">
            <div class="aside">
                <h2>查尼亚是什么?</h2>
                <p>查尼亚是克里特岛上的一座城市.</p>
                <h2>查尼亚在哪里?</h2>
                <p>克里特岛是位于地中海的一个希腊岛屿.</p>
                <h2>如何去查尼亚?</h2>
                <p>你可以从欧洲各地到达查尼亚机场.</p>
            </div>
        </div>

    </div>

    <div class="footer">
        <p>调整浏览器窗口的大小，以查看内容如何响应调整大小.</p>
    </div>