iframe標(biāo)簽

iframe標(biāo)簽會在當(dāng)前頁面內(nèi)嵌套一個頁面浮毯，這個頁面可以通過CSS來控制大小。

iframe頁面嵌套

iframe標(biāo)簽可以和a標(biāo)簽配合使用泰鸡，給iframe標(biāo)簽一個name债蓝，然后用a標(biāo)簽target指向iframe的name，就可以在iframe的頁面展示a標(biāo)簽鏈接的內(nèi)容盛龄。
例如：

<iframe name="4396" src="http://qq.com" frameborder="0"></iframe>
<br>
<a target="4396" >百度</a>

百度標(biāo)簽的效果如下：

a標(biāo)簽跳轉(zhuǎn)

a標(biāo)簽

a標(biāo)簽的target

a標(biāo)簽的target控制的跳轉(zhuǎn)有4種形式

<a  target="_blank">百度_blank</a>
<a  target="_self">百度_self</a>
<a  target="_parent">百度_parent</a>
<a  target="_top">百度_top</a>

當(dāng)在index中利用iframe標(biāo)簽指向inndex2時惦蚊，在index2中寫上述代碼器虾，會生成4個指向百度的鏈接，但實現(xiàn)的效果不一樣蹦锋。
_blank 瀏覽器會新開一個空頁面打開百度兆沙。
_self 瀏覽器會在index2頁面上（index中iframe標(biāo)簽生成的嵌套頁面）打開百度。
_parent瀏覽器會在index2的上一級頁面中打開百度莉掂。
_top 瀏覽器會在index2的最上層頁面中打開百度（如果有超過2級嵌套葛圃，比如index>index2>index3，如果a標(biāo)簽在index3頁面中憎妙，_top標(biāo)簽會在index頁面中打開鏈接）库正。

a標(biāo)簽的指向

下載

a標(biāo)簽指向下載有兩種方式

<a  download>下載</a>
content-type: application/octer-stream

第一種方式就是在a標(biāo)簽中指定download類型，第二種方式就是在跳轉(zhuǎn)頁面聲明這是個下載文件厘唾，不是展示文件褥符。

其他

<a >     跳轉(zhuǎn)到www.baidu.com
<a href="baidu.com">            打開當(dāng)前目錄下的baidu.com（并非以網(wǎng)站的形式打開）
<a >          繼承當(dāng)前頁面的協(xié)議來打開baidu.com
<a href="#">                    跳到錨點，不發(fā)請求
<a href="JavaScript:XXX;">      執(zhí)行一段JavaScript代碼抚垃，如果XXX內(nèi)容為空喷楣，那么點擊之后不會做跳轉(zhuǎn)，什么都不會做
<a href=" ">                    刷新頁面鹤树，跳轉(zhuǎn)自身
<a href="?name=baidu">          提交一次查詢請求

form

先看一段例子

<form action=" " method="POST">
    <input type="text" name="username">
    <input type="password" name="password">
    <input type="submit" value="提交">
</form>

form標(biāo)簽

image

input

input主要作為上傳參數(shù)的獲取方式坟募，例如<input type="submit" value="提交">會出現(xiàn)一個提交按鈕，點擊就可上傳一些參數(shù)邑狸。
但是如果form標(biāo)簽里面沒有type="submit"的input標(biāo)簽時懈糯，使用<button>提交</button>可將button自動升級為帶有type="submit"的input標(biāo)簽。

checkbox

此種input的作用是生成一個可供勾選的選項推溃，點擊就可勾選。

    熟悉的語言
    <input type="checkbox">C
    <input type="checkbox">Java

checkbox

    熟悉的語言
    <label><input type="checkbox">C</label>
    <label><input type="checkbox">Java</label>

radio

ridio也是生成一個可供勾選的選項，例如

    喜歡運動
    <label><input type="radio" value="yes">yes</label>
    <label><input type="radio" value="no">no</label>

radio

    喜歡運動
    <label><input name="443" type="radio" value="yes">yes</label>
    <label><input name="443" type="radio" value="no">no</label>

select

select是一個下拉框選項朴乖，比如：

    <select name="group">
        <option value="A">A</option>
        <option value="B" disabled>B</option>
        <option value="C" selected>C</option>
    </select>

select

    <select name="group" multiple>
        <option value="A">A</option>
        <option value="B" disabled>B</option>
        <option value="C" selected>C</option>
    </select>

這樣就可通過摁住ctrl或者shift進行多選了。

textrea

textrea是創(chuàng)建一個文本輸入框畜普，例如：
<textarea style="resize:none" name="簡介" cols="30" rows="10"></textarea>

textrea

table

table包含3個元素埠通，分別為thead、tbody逛犹、tfoot端辱。例如：

    <table>
        <thead>
            <tr>
                <td>編號</td><td>名字</td><td>數(shù)量</td>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>1</td><td>張三</td><td>10</td>
            </tr>
            <tr>
                <td>2</td><td>李四</td><td>15</td>
            </tr>
            <tr>
                <td>3</td><td>王五</td><td>10</td>
            </tr>
        </tbody>
        <tfoot>
            <tr>
                <td>合計</td><td></td><td>35</td>
            </tr>
        </tfoot>
    </table>

table

    <table border=1>                        //添加邊框
        <colgroup>
            <col width=100px>               //第一列的寬度
            <col width=100px>               //第二列的寬度
            <col bgcolor=red width=100px>   //添加背景色鸡岗，第三列的寬度
        </colgroup>
        <thead>
            <tr>
                <td>編號</td><td>名字</td><td>數(shù)量</td>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>1</td><td>張三</td><td>10</td>
            </tr>
            <tr>
                <td>2</td><td>李四</td><td>15</td>
            </tr>
            <tr>
                <td>3</td><td>王五</td><td>10</td>
            </tr>
        </tbody>
        <tfoot>
            <tr>
                <td>合計</td><td></td><td>35</td>
            </tr>
        </tfoot>
    </table>

加邊框table

還可通過CSS消除邊框的間隙混槐。

    <style>
        table{
            border-collapse: collapse;
        }
    </style>

無間隙table