html-查漏补缺

//缩写
<abbr title="Professor">Prof</abbr>
//首字母缩写
<acronym title="National Aeronautics and Space Administration">NASA</acronym>
//邮箱链接
<a href="mailto:homer@example.org">homer@example.org</a>
//引用
<cite>A Brief History of Time</cite>
//定义
<dfn>black hole</dfn>
//强调
<em>think</em>
<strong>Beware:</strong>    
//水平线
<hr />
//删除线
<del>worst</del>
//插入线
<ins>best</ins>
//回车
<br />
//引用
<blockquote cite="http://en.wikipedia.org/wiki/Winnie-the-Pooh">
            <p>Did you ever stop to think, and forget to start again?</p>
        </blockquote>
//字中间划线
<s>Was $995</s>
//上标
<sup>th</sup> 
//下标
<sub>1</sub>
//自定义列表
        <dl>
            <dt>Sashimi</dt>
            <dd>Sliced raw fish that is served with condiments such as shredded daikon radish or ginger root, wasabi and soy sauce</dd>
            <dt>Scale</dt>
            <dd>A device used to accurately measure the weight of ingredients</dd>
            <dd>A technique by which the scales are removed from the skin of a fish</dd>
            <dt>Scamorze</dt>
            <dt>Scamorzo</dt>
            <dd>An Italian cheese usually made from whole cow's milk (although it was traditionally made from buffalo milk)</dd>
        </dl>
//新打开一页
<a href="http://www.imdb.com" target="_blank">
//alt 图片加载不出来时给的提示，title图片提示
<img src="images/quokka.jpg" alt="Quokka (Setonix brachyurus)"  title="Individual Chocolate Cakes" />

//图像标签，图像标题
<figure>
            <img src="images/otters.jpg" alt="Photograph of two sea otters floating in water" />
            <br />
            <figcaption>Sea otters hold hands when they sleep so they don't drift away from each other.</figcaption>
        </figure>
//表格
<table>
    <thead>
    <tr>
        <th width="150"></th>
        <th scope="col" colspan="2" >Withdrawn</th>
    </tr>
    </thead>
    <tbody>
    <tr>
        <th scope="row" >45</th>
        <td rowspan="2">60</td>
        <td>80</td>
    </tr>
        <th>80</th>
        <td>90</td>
    </tbody>
    <tfoot>
    <tr>
        <th>80</th>
        <td>90</td>
        <td>90</td>
    </tr>
    </tfoot>
</table>
//按钮，表单
        <form action="http://www.example.com/add.php">
            <button><img src="images/add.gif" alt="add" width="10" height="10" /> Add</button>
            <input type="hidden" name="bookmark" value="lyrics" />
        </form>
//多选框
        <form action="http://www.example.com/profile.php">
            <p>Please select your favorite music service(s):
                <br />
                <input type="checkbox" name="service" value="itunes" checked="checked" /> iTunes
                <input type="checkbox" name="service" value="lastfm" /> Last.fm
                <input type="checkbox" name="service" value="spotify" /> Spotify
            </p>
        </form>
//下拉列表
        <form action="http://www.example.com/profile.php">
            <p>What device do you listen to music on?</p>
            <select name="devices">
                <option value="ipod">ipod</option>
                <option value="radio">Radio</option>
                <option value="computer">Computer</option>
            </select>
        </form>
//表单集合, 文本框，邮箱框，label包裹
            <fieldset>
                <legend>Your Details:</legend>
                <label>Name: <input type="text" name="name" size="30" maxlength="100"></label><br />
                <label>Email: <input type="email" name="email" size="30" maxlength="100"></label><br />
            </fieldset><br />
//label for用法
                    <label for="hear-about">How did you hear about us?</label>
                    <select name="referrer" id="hear-about">
                        <option value="google">Google</option>
                        <option value="friend">Friend</option>
                        <option value="advert">Advert</option>
                        <option value="other">Other</option>
                    </select>
//单选框
                    <label><input type="radio" name="rating" value="yes" /> Yes</label>
                    <label><input type="radio" name="rating" value="no" /> No</label>
                    <label><input type="radio" name="rating" value="maybe" /> Maybe</label>
//textarea框
<textarea rows="4" cols="40" id="comments"></textarea>
//提交按钮
<input type="submit" value="Submit review" />
//选择文件
<input type="file" name="user-song" value="Upload"/><br />
（这个文字是各个浏览器不一样的，Chrome是“选择文件”，FireFox是“浏览”。。因为这个是一个浏览器内部的决定，无法更改。想要改的话就弄一个隐藏的file input，显示的是一个常规的input和一个button，这样直接修改button的名称就可以了，然后button的click指向隐藏的file的excute之类，再将file中的路径名贴到常规input上来，简单来说就是模仿一个。
<input id='showSrc' type='text' /><input type='button' value='Brows'  OnClick='javascript:$("#hiddenFile").Click();'/>
<input id='hiddenFile' type='file' OnChange='javascript:xxx();' />
再决定OnChange函数同步路径到'showSrc'，hiddenFile的隐藏可以在document.ready时用$('#hiddenFile').hide）

//h5 日期输入框 输入框提示词 placeholder
<input id="username" type="date" name="depart" placeholder="Enter keyword"/>
//h5表单验证 required需要填写，密码输入框
<input type="password" name="password" id="password" required="required" />
//h5搜索框
<input type="search" name="search" />
//url输入框
<input type="url" name="website" />
//图片按钮
<input type="image" src="images/subscribe.jpg" width="100" height="20" />
//多选框
            <select name="instruments" size="3" multiple="multiple">
                <option value="guitar" selected="selected">Guitar</option>
                <option value="drums">Drums</option>
                <option value="keyboard" selected="selected">Keyboard</option>
                <option value="bass">Bass</option>
            </select>
//注释
        <!-- start of introduction -->
        <h1>Current Exhibitions</h1>
        <h2>Olafur Eliasson</h2>
        <!-- end of introduction -->
//网页信息
        <meta name="description" content="Telephone, email and directions for The Art Bookshop, London, UK" />
        <meta name="keywords" content="installation, art, opinion" />
        //加入搜索引擎，不加入页面的其他链接
        <meta name="robots" content="nofollow" />
        <meta http-equiv="author" content="Jon Duckett" />
        //不缓存当前页面
        <meta http-equiv="pragma" content="no-cache" />
        //指定缓存页面的过期时间，
        <meta http-equiv="expires" content="Fri, 04 Apr 2014 23:59:59 GMT" />
//内联部分
<span class="gallery">Tate Modern</span>
//内联模块
        <iframe src="http://maps.google.co.uk/maps?q=moma+new+york&amp;output=embed" width="450" height="350" frameborder="0" scrolling="no">
        </iframe>
//flash文件swf播放
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
//id#bird的地方防止，最低播放版本8.0.0“”
        <script type="text/javascript">swfobject.embedSWF("flash/bird.swf", "bird", "400", "300", "8.0.0");</script>
//播放MP3
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
        <script type="text/javascript">
            var flashvars = {};
            var params = {mp3: "audio/test-audio.mp3"};
            swfobject.embedSWF("flash/player_mp3_1.0.0.swf", "music-player", "200", "20", "8.0.0", flashvars, params);
        </script>
//播放flash电影
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
        <script type="text/javascript">
            var flashvars = {};
            var params = {
            movie:"../video/puppy.flv" };
            swfobject.embedSWF("flash/osplayer.swf", "snow", "400", "345", "8.0.0", flashvars, params);
            </script>
//h5播放音频
        <audio src="audio/test-audio.ogg" controls autoplay>
            <p>This browser does not support our audio format.</p>
        </audio>
//h5播放视频
        <video src="video/puppy.mp4" 
            poster="images/puppy.jpg" 
            width="400" height="300" 

            controls
            loop>
            <p>A video of a puppy playing in the snow</p>
        </video>
//flash、多格式H5视频兼容方式
        <script type="text/javascript" src="swfobject/swfobject.js"></script>
        <script type="text/javascript">
            var flashvars = {};
            var params = {movie: "../video/puppy.flv"};
            swfobject.embedSWF("flash/osplayer.swf", "snow", "400", "320", "8.0.0", flashvars, params);
        </script>
        <video poster="images/puppy.jpg" width="400" height="320" controls="controls">
            <source src="video/puppy.mp4" type='video/mp4;codecs="avc1.42E01E, mp4a.40.2"' />
            <source src="video/puppy.webm" type='video/webm;codecs="vp8, vorbis"' />
            <div id="snow">
                <p>You cannot see this video of a puppy playing in the snow because this browser does not support our video formats.</p>
            </div>
        </video>
//兼容MP3格式
        <audio controls autoplay>
            <source src="audio/test-audio.ogg" />
            <source src="audio/test-audio.mp3" />
            <p>This browser does not support our audio format.</p>
        </audio>
//h5标签
header, section, footer, aside, nav, article, figure, figcaption {
    display: block;}