Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537 Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537 欧美一区二区视频三区,麻豆一区二区三区在线观看 ,日韩不卡手机视频在线观看 

      

        

          



          
	
          
		
          
			
			
          
				
          整合營銷服務商
          
				
          電腦端+手機端+微信端=數據同步管理
          
			
          
			
          				
				
          免費咨詢熱線：
          			
			
          
		
          
	
          
		
	
	
	

          


          
	

          

 

          
  
          
    
          
      
          
        
          設置div高度等于動態寬度
          
        
           
          
	
	
          
		
                        
          目中有時候會遇到這個問題：一行有3個div，希望這3個div平分屏幕寬度，并且高度等于寬度。 
          第一個問題：平分屏幕寬度 
          可以對div設置百分比寬度，而不是直接用px寬度，這里用到了響應式設計的思想，可以參考這篇文章：自適應網頁設計（Responsive Web Design） 
          第二個問題：動態設置高度和寬度一致 
          有兩種方法，一種是用js動態設置，一種是直接用CSS設置 
          先看下html代碼
          <ul>
           <li class="container">
           <div class="dummy">
           </div>
           <div class="element">
           some text
           </div>
           </li>
           <li class="container">
           <div class="dummy">
           </div>
           <div class="element">
           some text
           </div>
           </li>
           <li class="container">
           <div class="dummy">
           </div>
           <div class="element">
           some text
           </div>
           </li>
          </ul>
          • 1
          • 2
          • 3
          • 4
          • 5
          • 6
          • 7
          • 8
          • 9
          • 10
          • 11
          • 12
          • 13
          • 14
          • 15
          • 16
          • 17
          • 18
          • 19
          • 20
          • 21
          • 22
          • 23
          公用的CSS
          ul,li{
           list-style: none;
           }
           * {
           margin: 0;
           padding: 0;
           outline: 0
           }
           body {
           margin: 0;
           padding: 0;
           -webkit-appearance: none;
           font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
           font-size: 16px;
           }
           ul{
           margin:10px;
           }
           .container {
           display: inline-block;
           position: relative;
           width: 32%;
           text-align: center;
           }
          • 1
          • 2
          • 3
          • 4
          • 5
          • 6
          • 7
          • 8
          • 9
          • 10
          • 11
          • 12
          • 13
          • 14
          • 15
          • 16
          • 17
          • 18
          • 19
          • 20
          • 21
          • 22
          • 23
          • 24
          用js動態設置
          var cw = $('.dummy').width();
          $('.dummy').css({'height':cw+'px'});
          $(window).resize(function() {
           var cw = $('.dummy').width();
           $('.dummy').css({'height':cw+'px'});
          }); 
          • 1
          • 2
          • 3
          • 4
          • 5
          • 6
          用CSS設置
           .dummy {
           padding-top: 100%; /* 1:1 aspect ratio */
           width: 100%;
           background: #333333;
           }
          • 1
          • 2
          • 3
          • 4
          • 5
          CSS設置padding-top的原理：Use CSS to Specify the Aspect Ratio of a Fluid Element
          /——————————————————— 
          然后嘗試對圖片設置高度等于動態寬度 
          js方法很簡單，跟上面的方法基本相同
          <ul>
           <li class="container">
           <img src="images/test_1.jpg"/>
           <div class="element">
           some text
           </div>
           </li>
           <li class="container">
           <img src="images/test_2.jpg"/>
           <div class="element">
           some text
           </div>
           </li>
           <li class="container">
           <img src="images/test_3.jpg"/>
           <div class="element">
           some text
           </div>
           </li>
          </ul>
          • 1
          • 2
          • 3
          • 4
          • 5
          • 6
          • 7
          • 8
          • 9
          • 10
          • 11
          • 12
          • 13
          • 14
          • 15
          • 16
          • 17
          • 18
          • 19
          • 20
          .container {
           display: inline-block;
           position: relative;
           width: 32%;
           text-align: center;
           }
           .container img{
           width: 100%;
           height:100%;
           }
          • 1
          • 2
          • 3
          • 4
          • 5
          • 6
          • 7
          • 8
          • 9
          • 10
          var cw = $('.dummy').width();
          $('.dummy').css({'height':cw+'px'});
          $(window).resize(function() {
           var cw = $('.dummy').width();
           $('.dummy').css({'height':cw+'px'});
          });
          • 1
          • 2
          • 3
          • 4
          • 5
          • 6
          CSS方法
          <ul>
           <li class="container">
           <div class="dummy">
           </div>
           <div class="element">
           some text
           </div>
           </li>
           <li class="container">
           <div class="dummy">
           </div>
           <div class="element">
           some text
           </div>
           </li>
           <li class="container">
           <div class="dummy">
           </div>
           <div class="element">
           some text
           </div>
           </li>
          </ul>
          • 1
          • 2
          • 3
          • 4
          • 5
          • 6
          • 7
          • 8
          • 9
          • 10
          • 11
          • 12
          • 13
          • 14
          • 15
          • 16
          • 17
          • 18
          • 19
          • 20
          • 21
          • 22
          • 23
          .container {
           display: inline-block;
           position: relative;
           width: 32%;
           text-align: center;
           }
          .dummy{
           padding-top: 100%; /* 1:1 aspect ratio */
           width: 100%;
           background:url(images/test_3.jpg) no-repeat;
           -webkit-background-size: 100%;
           background-size: 100%;
           } 
          • 1
          • 2
          • 3
          • 4
          • 5
          • 6
          • 7
          • 8
          • 9
          • 10
          • 11
          • 12
          • 13
          通過設置background可以實現。 
          div包含img的方法沒有試驗成功，以后繼續嘗試 
          /————————————- 
          還有一個問題，怎么設置div和img之間的padding，又能保證div寬度是屏幕寬度的三分之一？
          見標簽
          1.段落標簽<p>
          • <p>標簽的默認樣式，段前段后都會有空白，如果不喜歡這個空白，可以用css樣式來刪除或改變它。
          • 改變CSS樣式刪除段前段后空白處。
          <style> 
 p{margin:0px;} 
</style>

          2.斜體標簽<em>
           <em>斜體</em>

          3.粗體標簽<strong>
           <strong>加粗</strong>

          4.<span>標簽
          被用來組合文檔中的行內元素。使用 <span> 來組合行內元素，以便通過樣式來格式化它們。
          • <span> 在CSS定義中屬于一個行內元素,在行內定義一個區域，也就是一行內可以被 <span>劃分成好幾個區域，從而實現某種特定效果。
          • <span>本身沒有任何屬性。
          • <div>在CSS定義中屬于一個塊級元素<div>可以包含段落、標題、表格甚至其它部分。這使DIV便于建立不同集成的類，如章節、摘要或備注。在頁面效果上，使用<div> 會自動換行，使用<span> 就會保持同行。
          例如：
           <style> 
 span{ color:blue; } 
 </style>

          這樣，<span>標簽包含的文本就變成了藍色的字體。
          5.<q>標簽
          作用：段文本引用
          例如：
          <p>最初知道莊子，是從一首詩<q>莊生曉夢迷蝴蝶。望帝春心托杜鵑。</q>開始的。雖然當時不知道是什么意思，只是覺得詩句挺特別。后來才明白這個典故出自是莊子的《逍遙游》，《逍遙游》代表了莊子思想的最高境界，是對世俗社會的功名利祿及自己的舍棄。</p>
在上面的例子中，“莊生曉夢迷蝴蝶。望帝春心托杜鵑。” 這是一句詩歌，出自晚唐詩人李商隱的《錦瑟》 。因為不是作者自己的文字，所以需要使用<q></q>實現引用。
注意要引用的文本不用加雙引號，瀏覽器會對q標簽自動添加雙引號。
這里用<q>標簽的真正關鍵點不是它的默認樣式雙引號（如果這樣我們不如自己在鍵盤上輸入雙引號就行了），而是它的語義：引用別人的話。
補充知識：語義化網頁結構有助于搜索引擎的收錄。同一個效果可以用很多鐘方式實現，但這只方便了瀏覽者，而搜索引擎不知道這里到底是什么內容，這里如果你使用標簽，那么就告訴瀏覽器這里是引用的話。而且在手持設備或移動設備不能很好支持css的基礎上，瀏覽器會使用默認的效果，因而提供較好可讀性。

          6.<blockquote>標簽
          作用：長文本引用
          例如：
          <blockquote>明月出天山，蒼茫云海間。長風幾萬里，吹度玉門關。漢下白登道，胡窺青海灣。由來征戰地，不見有人還。 戍客望邊色，思歸多苦顏。高樓當此夜，嘆息未應閑。</blockquote>

          注意：瀏覽器對<blockquote>標簽的解析是縮進樣式
          7.<br>標簽
          怎么可以讓每一句詩詞后面加入一個折行呢？那就可以用到<br />標簽了，在需要加回車換行的地方加入<br />，<br />標簽作用相當于word文檔中的回車。
          語法：
          xhtml1.0寫法：
           <br/>

          html4.01寫法：
           <br>

          現在一般使用 xhtml1.0 的版本的寫法（其它標簽也是），這種版本比較規范。
          與以前我們學過的標簽不一樣，<br />標簽是一個空標簽，沒有HTML內容的標簽就是空標簽，空標簽只需要寫一個開始標簽，這樣的標簽有<br />、<hr />和<img />。
          講到這里，你是不是有個疑問，想折行還不好說嘛，就像在 word 文件檔或記事本中，在想要折行的前面輸入回車不就行了嗎？ 不好意思，在 html 中是忽略回車和空格的，你輸入的再多回車和空格也是顯示不出來的。
          8.<hr>標簽
          在信息展示時，有時會需要加一些用于分隔的橫線，這樣會使文章看起來整齊些。
          語法：
          html4.01版本
          <hr>

          xhtml1.0版本
          <hr/>

          注意：
          • <hr />標簽和<br />標簽一樣也是一個空標簽，所以只有一個開始標簽，沒有結束標簽。
          • <hr />標簽的在瀏覽器中的默認樣式線條比較粗，顏色為灰色，可能有些人覺得這種樣式不美觀，沒有關系，這些外在樣式在我們以后學習了css樣式表之后，都可以對其修改。
          • 大家注意，現在一般使用 xhtml1.0 的版本（其它標簽也是），這種版本比較規范。
          9.<address>標簽
          一般網頁中會有一些網站的聯系地址信息需要在網頁中展示出來，這些聯系地址信息如公司的地址就可以<address>標簽。也可以定義一個地址（比如電子郵件地址）、簽名或者文檔的作者身份。
          語法：
           <address>聯系地址信息</address>

          如：
          <address>文檔編寫：lilian 北京市西城區德外大街10號</address>

          10.<code>標簽
          在介紹語言技術的網站中，避免不了在網頁中顯示一些計算機專業的編程代碼，當代碼為一行代碼時，你就可以使用<code>標簽了，如下面例子：
          <code>var i=i+300;</code>

          注意：在文章中一般如果要插入多行代碼時不能使用<code>標簽了。
          語法：
          <code>代碼語言</code>

          注：如果是多行代碼，可以使用<pre>標簽。
          11.<pre>標簽
          主要作用:預格式化的文本。被包圍在 pre 元素中的文本通常會保留空格和換行符。
          語法：
          <pre>語言代碼段</pre>

          如下代碼：
          <pre> 
 var message="歡迎"; 
 for(var i=1;i<=10;i++) { 
 alert(message); 
 } 
</pre>

          效果如下：
          注意：<pre> 標簽不只是為顯示計算機的源代碼時用的，在你需要在網頁中預顯示格式時都可以使用它，只是<pre>標簽的一個常見應用就是用來展示計算機的源代碼。
          12.<ul>標簽
          ul-li是沒有前后順序的信息列表。
          • 這樣是空心圓，
          ul{ list-style:circle; }

          • 這個就是去除前面的點
          ul{ list-style:none }

          • 語法：
          <ul> 
 <li>信息</li> 
 <li>信息</li> 
 ...... 
</ul>

          • 舉例：
          <ul> 
 <li>精彩少年</li> 
 <li>美麗突然出現</li> 
 <li>觸動心靈的旋律</li> 
</ul>

          • ul-li在網頁中顯示的默認樣式一般為：每項li前都自帶一個圓點
          13.<ol>標簽
          ol-li是有前后順序的信息列表
          • 語法：
          <ol> 
 <li>信息</li> 
 <li>信息</li> 
 ...... 
</ol>

          • 舉例：
           <ol> 
 <li>前端開發面試心法 </li> 
 <li>零基礎學習html</li>
 <li>JavaScript全攻略</li> 
</ol>

          <ol>在網頁中顯示的默認樣式一般為：每項<li>前都自帶一個序號，序號默認從1開始。
          14.<div>標簽
          • <div> 可定義文檔中的分區或節（division/section）。
          • <div>標簽可以把文檔分割為獨立的、不同的部分。它可以用作嚴格的組織工具，并且不使用任何格式與其關聯。
          • 如果用 id 或 class 來標記 <div>，那么該標簽的作用會變得更加有效。
          • <div>是一個塊級元素。這意味著它的內容自動地開始一個新行。實際上，換行是 <div>固有的唯一格式表現。可以通過<div> 的 class 或 id 應用額外的樣式。不必為每一個 <div> 都加上類或 id，雖然這樣做也有一定的好處。
          • 可以對同一個 <div>元素應用 class 或 id 屬性，但是更常見的情況是只應用其中一種。這兩者的主要差異是，class 用于元素組（類似的元素，或者可以理解為某一類元素），而id 用于標識單獨的唯一的元素。
          15.<table>標簽
          • 常用屬性
          1）屬性：border
          作用：規定表格邊框的寬度
          2）屬性：cellpadding
          作用：單元格中的文本與單元格邊框的間距
          3）屬性：cellspacing
          作用：單元格之間的間距
          • 創建表格的四個元素：
          table、tbody、tr、th、td
          1、<table>…</table>：整個表格以<table>標記開始、</table>標記結束。
          2、<tbody>…</tbody>：當表格內容非常多時，表格會下載一點顯示一點，但如果加上<tbody>標簽后，這個表格就要等表格內容全部下載完才會顯示。如右側代碼編輯器中的代碼。
          3、<tr>…</tr>：表格的一行，所以有幾對tr 表格就有幾行。
          4、<td>…</td>：表格的一個單元格，一行中包含幾對<td>...</td>，說明一行中就有幾列。
          - 常用屬性： colspan：規定單元格可橫跨的列數，值為數字 rowspan：規定單元格可橫跨的行數，值為數字
          5、<th>…</th>：表格的頭部的一個單元格，表格表頭。
          6、表格中列的個數，取決于一行中數據單元格的個數。
          總結：
          • 1、表頭，也就是th標簽中的文本默認為粗體并且居中顯示
          • 2、table表格在沒有添加css樣式之前，在瀏覽器中顯示是沒有表格線的
          • 3、用css樣式，為表格加入邊框Table 表格在沒有添加 css 樣式之前，是沒有邊框的。
          16.<caption>標簽
          表格還是需要添加一些標簽進行優化，可以添加標題和摘要。
          • 摘要
          摘要的內容是不會在瀏覽器中顯示出來的。它的作用是增加表格的可讀性(語義化)，使搜索引擎更好的讀懂表格內容，還可以使屏幕閱讀器更好的幫助特殊用戶讀取表格內容。語法：
          <table summary="表格簡介文本">

          • 標題
          用以描述表格內容，標題的顯示位置：表格上方。語法：
          <table> 
 <caption>標題文本</caption> 
 <tr> 
 <td>…</td> 
 <td>…</td> 
 … 
 </tr> 
 … 
</table>

          17.<a>標簽
          • _blank --在新窗口中打開鏈接
          • _parent --在父窗體中打開鏈接
          • _self --在當前窗體打開鏈接,此為默認值
          • _top --在當前窗體打開鏈接，并替換當前的整個窗體(框架頁)
          • 一個對應的框架頁的名稱 -在對應框架頁中打開
          • href：Hypertext Reference的縮寫。意思是超文本引用。
          • 使用<a>標簽可實現超鏈接，它在網頁制作中可以說是無處不在，只要有鏈接的地方，就會有這個標簽。語法：
           <a href="目標網址" title="鼠標滑過顯示的文本">鏈接顯示的文本</a>

          例如：
           <a  title="點擊進入慕課網">click here!</a>

          上面例子作用是單擊click here!文字，網頁鏈接跳轉到http://www.imooc.com這個網頁。
          • <a>標簽在默認情況下，鏈接的網頁是在當前瀏覽器窗口中打開，有時我們需要在新的瀏覽器窗口中打開。如下代碼：
           <a href="目標網址" target="_blank">click here!</a>

          • title屬性的作用，鼠標滑過鏈接文字時會顯示這個屬性的文本內容。這個屬性在實際網頁開發中作用很大，主要方便搜索引擎了解鏈接地址的內容（語義化更友好）。
          • 注意：還有一個有趣的現象不知道小伙伴們發現了沒有，只要為文本加入a標簽后，文字的顏色就會自動變為藍色（被點擊過的文本顏色為紫色），顏色很難看吧，不過沒有關系后面我們學習了css樣子就可以設置過來（a{color:#000}),下面會詳細講解。
          • 使用mailto在網頁中鏈接Email地址
          <a>標簽還有一個作用是可以鏈接Email地址，使用mailto能讓訪問者便捷向網站管理者發送電子郵件。
          注意：如果mailto后面同時有多個參數的話，第一個參數必須以“?”開頭，后面的參數每一個都以“&”分隔。引號只有一對！
          例子：
<a href="mailto:yy@qq.com? cc=xx@qq.com & bcc=aa@qq.com & subject=郵件主題 & body=郵件內容">

          • 如果：A 發送郵件給B1、B2、B3，抄送給C1、C2、C3，密送給D1、D2、D3。
          那么：
1）A知道自己發送郵件給了B1、B2、B3，并且抄送給了C1、C2、C3，密送給了D1、D2、D3。
2）B1知道這封是A發送給B1、B2、B3的郵件，并且抄送給了C1、C2、C3，但不知道密送給了D1、D2、D3。
3）C1知道這封是A發送給B1、B2、B3的郵件，并且抄送給了C1、C2、C3，但不知道密送給了D1、D2、D3。
4）D1知道這封是A發送給B1、B2、B3的郵件，并且抄送給了C1、C2、C3，而且密送給了自己，但不知道密送給了D2、D3。
5）郵箱地址
 mailto: <a href="mailto:qiujie@staff.weibo.com">發送</a>
6）抄送地址
cc: <a href="mailto:qiujie@staff.weibo.com?cc=zz@sina.com">發送</a>
7）密件抄送地址
用分號分隔: <a href="mailto:qiujie@staff.weibo.com?bcc=zz@sina.com">發送</a>
8）多個收件人、抄送人、密送人 ;
bcc: <a href="mailto:qiujie@staff.weibo.com;zz@sina.com">發送</a>
9）郵件主題
subject: <a href="mailto:qiujie@staff.weibo.com？subject=郵件主題">發送</a>
10）郵件內容
body: <a href="mailto:qiujie@staff.weibo.com？body=郵件正文">發送</a>
例子：
<a href="mailto:yy@imooc.com;10001@qq.com?cc=10002@qq.com&bbc=madanteng@qqhelp.com&subject=觀了不起的蓋茨比有感。&body=你好，對此評論有些想法。">對此影評有何感想，發送郵件給我</a>

          18.<img>標簽
          在網頁的制作中為使網頁炫麗美觀，肯定是缺少不了圖片，可以使用
          標簽來插入圖片。
          • 語法：
           [站外圖片上傳中……(2)] <img src = "myimage.gif" alt = "My Image" title = "My Image" />

          • 講解：
          src：標識圖像的位置；
alt：指定圖像的描述性文本，當圖像不可見時（下載不成功時），可看到該屬性指定的文本；
title：提供在圖像可見時對圖像的描述(鼠標滑過圖片時顯示的文本)；
圖像可以是GIF，PNG，JPEG格式的圖像文件。
路徑有兩種填寫方式：絕對路徑、相對路徑
相對路徑：相對于我們當前 html 文件的位置來寫路徑即可！
./表示當前目錄，../表示上一級目錄

          19.<form>標簽
          注意:
          1、所有表單控件（文本框、文本域、按鈕、單選框、復選框等）都必須放在<form></form>標簽之間（否則用戶輸入的信息可提交不到服務器上哦！）。
          2、method:post/get的區別這一部分內容屬于后端程序員考慮的問題。
          • 網站怎樣與用戶進行交互？答案是使用HTML表單(form)。表單是可以把瀏覽者輸入的數據傳送到服務器端，這樣服務器端程序就可以處理表單傳過來的數據。
          語法：
          <form method="傳送方式" action="服務器文件">

          • 講解：
          <form> ：<form>標簽是成對出現的，以<form>開始，以</form>結束。
action ：瀏覽者輸入的數據被傳送到的地方,比如一個PHP頁面(save.php)。
method ： 數據傳送的方式（get/post）。
 <form method="post" action="save.php"> 
 <label for="username">用戶名:</label> 
 <input type="text" name="username" /> 
 <label for="pass">密碼:</label> 
 <input type="password" name="pass" /> 
 </form>

          20.<input>標簽
          • 當用戶要在表單中鍵入字母、數字等內容時，就會用到文本輸入框。文本框也可以轉化為密碼輸入框。
          語法：
           <form> 
 <input type="text/password" name="名稱" value="文本" /> 
 </form>

          • 屬性：
          舉例：
 <form> 
 姓名： <input type="text" name="myName"/><br/> 
 密碼： <input type="password" name="pass"/> 
 </form>
 value="xxx" 替換為 placeholder="xxx" 的體驗更好一些，placeholder屬性為 HTML 5 的新屬性。placeholder 屬性提供可描述輸入字段預期值的提示信息（hint）。該提示會在輸入字段為空時顯示，并會在字段獲得焦點時消失。

          語法：
          <input placeholder="text"/>
注釋：placeholder 屬性適用于以下的 <input> 類型：text, search, url, telephone, email 以及 password。

          注意:同一組的單選按鈕，name 取值一定要一致，比如上同一個名稱“gender”，這樣同一組的單選按鈕才可以起到單選的作用！
          type：
          • 當type="text"時，輸入框為文本輸入框;
          • 當type="password"時, 輸入框為密碼輸入框。
          • hidden 定義隱藏輸入字段
          • image 定義圖像作為提交按鈕
          • number 定義帶有 spinner 控件的數字字段
          • password 定義密碼字段。字段中的字符會被遮蔽
          • radio 定義單選按鈕
          • checkbox 定義復選框按鈕
          • range 定義帶有 slider 控件的數字字段
          • reset 定義重置按鈕。重置按鈕會將所有表單字段重置為初始值
          • search 定義用于搜索的文本字段
          • submit 定義提交按鈕。提交按鈕向服務器發送數據
          • text 默認。定義單行輸入字段，用戶可在其中輸入文本。默認是 20 個字符
          • url 定義用于 URL 的文本字段
          name：為文本框命名，以備后臺程序ASP 、PHP使用。
          value：為文本輸入框設置默認值。(一般起到提示作用)
          21.<textarea>標簽
          • 當用戶需要在表單中輸入大段文字時，需要用到文本輸入域。
          語法：
           <textarea rows="行數" cols="列數">文本</textarea>

          1. <textarea>標簽是成對出現的，以<textarea>開始，以</textarea>結束。
          2. cols ：多行輸入域的列數。
          3. rows ：多行輸入域的行數。
          4. 在<textarea></textarea>標簽之間可以輸入默認值。
          舉例：
           <form method="post" action="save.php"> 
 <label>聯系我們</label> 
 <textarea cols="50" rows="10" >在這里輸入內容...</textarea> 
 </form>

          22.<select>標簽
          • 使用下拉列表框，節省空間。下拉列表在網頁中也常會用到，它可以有效的節省網頁空間。既可以單選、又可以多選。
          語法：
           <select> 
 <option value="提交的值">顯示的值</option> ... 
 </select>
 設置selected="selected"屬性，則該選項就被默認選中。 
 selected="selected"

          • 若想實現多選
          <select multiple="multiple"> 然后選擇時候按ctrl點鼠標選中

          • 若想讓某個選項不可選
          <option disabled="disabled">

          • optgroup 標簽
          把相關的選項組合在一起
          屬性 label：給選項組命名
          屬性 disabled：禁用該選項組
          23.<label>標簽
          • label標簽不會向用戶呈現任何特殊效果，它的作用是為鼠標用戶改進了可用性。如果你在 label 標簽內點擊文本，就會觸發此控件。就是說，當用戶單擊選中該label標簽時，瀏覽器就會自動將焦點轉到和標簽相關的表單控件上（就自動選中和該label標簽相關連的表單控件上）。
          • 語法：
           <label for="控件id名稱">

          注意：標簽的 for 屬性中的值應當與相關控件的 id 屬性值一定要相同。
          • 例子：
           <form> 
 <label for="male">男</label> 
 <input type="radio" name="gender" id="male" /> <br /> 
 <label for="female">女</label> 
 <input type="radio" name="gender" id="female" /> 
 <label for="email">輸入你的郵箱地址</label> 
 <input type="email" id="email" placeholder="Enter email"> 
 </form>

          24.<map>標簽
          使用 map 標簽可以給圖片某塊區域加超鏈接
          使用方法：
          1）為 map 標簽首先加上 id 屬性用來為 map 標簽定義一個唯一的名稱
          2）為了保證兼容性再加上 name 屬性，屬性值與 id 的值相同
          3）為 map 標簽所作用的圖片加上 usemap 屬性，屬性值為 #id 名稱
          4）在 map 標簽內嵌套 area 標簽來實現給指定區域加鏈接
           <area shape="" coords="" href ="" alt="" />
 shape 屬性：定義鏈接區域的形狀，常用值 rect、circle
 coords 屬性：確定區域的精確位置。填寫坐標即可，以父元素左上角為原點，可借助qq截圖來得到想要的坐標
 href 屬性：填寫鏈接地址即可
 alt 屬性：給鏈接加一些說明信息

          例子：
           <map id="img1" name="img1"> 
 <area shape="rect" coords="184,33,391,258" href="http:www.baidu.com" alt="百度一下" target="_blank" /> 
 <area shape="circle" coords="507,287,20"  alt="私房庫我的博客" target="_blank" /> 
 </map>

          注意：
          1. 第一個coords的四個參數中，前兩個參數為矩形的接近原點的頂角的坐標，后兩個參數為對角的坐標。
          2. 第二個coords的三個參數中，前兩個為圓心坐標，第三個參數為圓的半徑。
          25.<iframe>標簽
          創建包含另外一個文檔的內聯框架（即行內框架）
          屬性：
          • frameborder
          值：1、0
          作用：規定是否顯示框架周圍的邊框。
          • width值：以像素計的寬度值、以包含元素百分比計的寬度值
          作用：定義 iframe 的寬度
          • height
          作用：定義高度
          • name
          作用：給 iframe 命名
          • scrolling
          值：yes、no、auto
          作用：規定是否在 iframe 中顯示滾動條
          • src
          作用：規定在 iframe 中顯示的文檔的 URL
          可以是本地的 html 文件，也可以是遠程的 html 文件
          標簽寫法與嵌套的討論
          標簽寫法
          • 元素標記的省略（在 html5 里面有的標記是可以省略不寫的）
          1）不允許寫結束標簽的元素
          area,base,br,col,command,embed,hr,img,input,keygen,link,meta,paran,source,track,wbr。這些標簽都是單標簽例如：br 標簽，不可以這樣<br></br>，只能<br />這樣來關閉標簽。

          2）可以省略結束標記的元素有：
           li,dt,dd,p,rt,rp,optgroup,option,colgroup,thead,tbody,tfoot,tr,td,th。

          3）可以省略全部標記的元素有
           html,head,body,colgroup,tbody

          • 具有 boolean 值得屬性
           例如：disabled,readonly，checked 等只寫屬性而不寫屬性值得時候當做 ture
 不寫屬性表示 false

          • 屬性值的引號可以省略
           要求：屬性值不包含 空字符串，<，>，=， ‘

          標簽嵌套探討
          1.html 規定我們必須要嵌套著寫的標簽
          例如：頁面頭部是嵌套在 head 標簽里面的，主體內容都是嵌套在 body 標簽里面的表單的內容是嵌套在 form 標簽里面的，dt、dd 是嵌套在 dl 標簽里面的，li 是嵌套到ul 標簽里面的，等等...
          2.塊級元素可以嵌套內聯元素，但是內聯元素不能包含塊元素
          <div>
 <span>我是一個 span 元素</span>
 </div> —— 對 
<span>
 <div>div 元素</div>
</span> —— 錯

          3.內聯元素可以嵌套內聯元素
          <a href="#">
 <span></span>
</a> —— 對

          4.塊級元素與塊級元素嵌套注意點
          • div 塊級元素是一個容器，幾乎可以存放任何常用標簽，包括自己，我們為什么要使用 div 來嵌套標簽？這個問題可以用用我們國家的省份劃分來解釋，國家需要劃分不同的省份來利于管理，那么我們 html 頁面也是的，整個 html 文檔元素太多，我們需要使用 div 標簽將頁面劃分成不同的塊，這樣可以對每塊進行分開管理，學完 css 我們就知道怎么進行管理了。
          • 塊級元素不能放在 p 標簽里面
          <p><ol><li></li></ol></p> —— 錯 <p><div></div></p> —— 錯

          • li 內可以包含 div 標簽，li 和 div 標簽都是裝載內容的容器，地位平等，沒有級別之分（例如：h1、h2 這樣森嚴的等級制度） ，要知道 li 標簽連它的父級 ul 或者是 ol 都可以容納的
          喜歡前端的小伙伴們可以在評論區留言，尋找和小馮童鞋一樣熱愛前端的友人，讓我們一起玩轉前端的世界！

          介
          HTML 是什么？
          htyper text markup language 即超文本標記語言。
          超文本: 就是指頁面內可以包含圖片、鏈接，甚至音樂、程序等非文字元素。
          標記語言: 標記（標簽）構成的語言。
          什么是標簽:
           是由一對尖括號包裹的單詞構成 例如: <html> *所有標簽中的單詞不可能以數字開頭.
           標簽不區分大小寫.<html> 和 <HTML>. 推薦使用小寫.
           標簽分為兩部分: 開始標簽<a> 和 結束標簽</a>. 兩個標簽之間的部分 我們叫做標簽體.
           有些標簽功能比較簡單.使用一個標簽即可.這種標簽叫做自閉和標簽.例如: <br/><hr/><input/><img/>
           標簽可以嵌套.但是不能交叉嵌套. <a><b></a></b>
          標簽的屬性:
           通常是以鍵值對形式出現的. 例如 name="nick"
           屬性只能出現在開始標簽 或 自閉和標簽中.
           屬性名字全部小寫. *屬性值必須使用雙引號或單引號包裹 例如 name="nick"
           如果屬性值和屬性名完全一樣.直接寫屬性名即可. 例如 readonly
          HTML5基本結構:
          將HTML4中的DTD定義為如下結構即可，其他不變。
          <!DOCTYPE HTML>
          HTML5支持的兩種指定頁面使用的字符集的方式:
          使用Content-Type指定字符集 
          <meta http-equiv="Content-Type" content="text/html ;charset=UTF-8"/>
          直接使用charset指定字符集
          <meta charset="UTF-8">
          <head> 標簽
          <title>
          <title>Title</title>
          <base/>
          標簽為頁面上的所有鏈接規定默認地址或默認目標。
          <!DOCTYPE html>
          <html lang="en">
          <head>
           <meta charset="UTF-8">
           <title>Title</title>
           <base href="http://p_w_picpaths.cnblogs.com/cnblogs_com/suoning/845162/"/>
           <base target="_blank" />
          </head>
          <body>
          <img src="o_s.png" alt="圖片加載失敗。。。"/>
          <a href="http://cnblogs.com/suoning/">nick blogs</a>
          </body>
          </html>
          # 上面這段代碼中，<img>標簽的src屬性是一個相對路徑，因為<head>中通過base標簽設置了鏈接的默認地址，
          所以img的src實際的地址是“http://p_w_picpaths.cnblogs.com/cnblogs_com/suoning/845162/o_s.png”。
          同樣的，<a>中只是指定了href，并未指定target屬性，所以也會使用base中設置的target屬性的值。
          <link/>
          引用外部文檔，常見于引用外部樣式。重要屬性有三個：rel、href、type。
          rel 規定文檔與被鏈接文檔之間的關系。
          rel="dns-prefetch" 預先解析緩存文檔中使用的域名，目的是為了提高網頁訪問速度。使用場景：在一個網頁頻繁使用其他域名資源時。
          rel="shortcut icon"或rel="icon" 在收藏和標題欄上用于顯示的圖標。示例：<link rel="icon" href="http://p_w_picpaths.cnblogs.com/cnblogs_com/suoning/845162/o_s.png">。注意：IE瀏覽器只支持ico格式，為了兼容IE，圖片文件采用ico格式。
          rel="stylesheet" 引用外部樣式表。
          rel="nofollow" 用于指示搜索引擎不要追蹤（爬蟲抓取），減少垃圾鏈接。用于<a>標簽，使用場景：網頁不被信任或是不希望唄搜索引擎錄入的網站。
          href 資源的路徑（相對路徑/絕對路徑）。
          type 規定被連接文檔的MIME類型，用于明確文件的打開方式。例如：.ico文件 p_w_picpath/x-icon。
          <meta/>
          定義關于HTML文檔的元數據。 重要的屬性有三個：http-equiv、name、content
          http-equiv 把content屬性值關聯到http頭部。
          Content-Type（瀏覽器接受的文檔類型，一般是text/html）
          refresh（網頁刷新，以秒為單位）
          expires（設定網頁到期時間，一旦過期，必須到服務器上重傳）
          <meta http-equiv="Content-Type" content="text/html ;charset=UTF-8"/>
          <meta http-equiv="Refresh" content="2">
          <meta http-equiv="Refresh" content="2;URL=https://www.baidu.com">
          <meta http-equiv="expires" content="6 Jun 2016"/>
          name 把content屬性關聯到一個名稱。
           keywords（搜索關鍵字，用于搜索引擎抓取信息的顯示）
           description（搜索到網站后顯示的網頁內容簡描述）
           author（站點制作者信息）
           generator（用以說明生成工具）
           name也可以根據特定的功能自定義，在新浪網中有使用360認證和搜狐認證（<meta name="360-site-verification"content="63349**********"/>、<meta name="sogou_site_verification"content="BVI*******"/>）。 
          <meta name="keywords" content="搜索關鍵字">
          <meta name="description" content="簡要描述">
          <meta name="author" content="http://cnblogs.com/suoning">
          <meta name="generator" content="用以說明生成工具">
          content 定義與http-equiv或name屬性相關的元信息，是必要的屬性。
          <body> 標簽
          1、塊級標簽和內聯標簽
          塊級標簽：<p><h1><table><ol><ul><form><div>
          內聯標簽：<a><input><img><sub><sup><textarea><span>
          block（塊）元素的特點
          ① 總是在新行上開始；
          ② 高度，行高以及外邊距和內邊距都可控制；
          ③ 寬度缺省是它的容器的100%，除非設定一個寬度。
          ④ 它可以容納內聯元素和其他塊元素
          inline（內聯）元素的特點
          ① 和其他元素都在一行上；
          ② 高，行高及外邊距和內邊距不可改變；
          ③ 寬度就是它的文字或圖片的寬度，不可改變
          ④ 內聯元素只能容納文本或者其他內聯元素
          對行內元素，需要注意如下
          設置寬度width 無效。
          設置高度height 無效，可以通過line-height來設置。
          設置margin 只有左右margin有效，上下無效。
          設置padding 只有左右padding有效，上下則無效。注意元素范圍是增大了，但是對元素周圍的內容是沒影響的。
          2、基本標簽
          <h1>~<h6> 標題標簽.
          <p>: 段落標簽. 包裹的內容被換行.并且也上下內容之間有一行空白.
          　　　　style="text-indent: 2em"可以設置樣式為首行縮進兩個字符。
          　　　　<blockquote></blockquote>可以用來設置整個段落的縮進。
          <b> <strong>: 加粗標簽.
          <strike>: 為文字加上一條中線.
          <u>: 文字下方加下劃線.
          <em> <i>: 文字變成斜體.
          <sup>和<sub>: 上角標 和 下角標.
          <br>:換行.
          <hr>:水平線.
          <div>
           塊級標簽。塊級標簽常用于布局，行級標簽常用語顯示內容。
          　　 div的顯示通常使用id或class來標識。id為唯一的標簽標識，class為標簽的類標識。
          　　 div的大小是由內容來決定的，默認情況下，高度由內容的高度決定，寬度適應屏幕。
          　　 可以容納其他元素，是一個容器。
          <span>
          3、特殊符號
          　　> >
          　　< <
          　　 空格
          　 " 引號
          　　© 版權符號
          特殊符號 符號碼
          " " ;
          & & ;
          < < ;
          > > ;
           © ;
           ® ;
          ± ± ;
          × × ;
          § § ;
           ¢ ;
           ¥ ;
          · · ;
           &euro ;
           £ ;
           &trade ;
           
          4、<a> 超鏈接標簽(錨標簽)
          重要屬性有三個：href、target、name
          href 超鏈接地址：可以是Web上任意資源，包括圖片，網頁，樣式，腳本文件等。href="#"時，表示被鏈接頁面就是當前頁面。
          target 文檔打開時要顯示的目標位置，屬性值一般有：_blank（新窗口中打開）、_self（默認，在超鏈接所在的容器中打開）、_parent（在超鏈接的父容器中打開）、_top（整個容器中打開）、name（框架名稱）。
          name 錨記名稱。作用：跳轉到文檔的某個地方。返回首頁。
          # 跳轉網頁
          <a href="http://cnblogs.com/suoning" target="_blank">Nick Blogs</a>
          # 跳轉錨記書簽名稱
          <a name="top"><h3>Top！</h3></a>
          <div style="height: 800px"></div>
          <a href="#top">top</a>
          1.標簽最簡式
          <a href="mailto:xxx@xx.com">郵件聯系</a>
          2.標簽幫你填抄送地址
          <a href="mailto:xxx@xx.com?cc=xxxx@xx.com">郵件聯系</a>
          3.標簽幫你填暗送地址
          <a href="mailto:xxx@xx.com?bcc=xxxx@xx.com">郵件聯系</a>
          4.暗,抄
          <a href="xxxxx@xx.com">郵件聯系</a>
          5.標簽幫你填主題
          <a href="mailto:xxx@xx.com?subject=這是主題">郵件聯系</a>
          6.填郵件內容
          <a href="mailto:xxx@xx.com?body=這是內容">郵件聯系</a>
          7.多址發送
          <a href="mailto:xxx@xx.com,xxxx@xx.com">郵件聯系</a>
          # http://shang.qq.com/v3/widget.html
          <a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=630571017&site=qq&menu=yes"><img border="0" src="http://wpa.qq.com/pa?p=2:630571017:51" alt="點擊這里給我發消息" title="點擊這里給我發消息"/></a>
          <a href="tencent://message/?uin=630571017" target="_blank"><img style="border:0px;" src=http://wpa.qq.com/pa?p=1:707321921:13></a>
          # 更多圖片地址如下：
          # http://wpa.qq.com/pa?p=1:707321921:1
          # http://wpa.qq.com/pa?p=1:707321921:2
          # http://wpa.qq.com/pa?p=1:707321921:3
          # http://wpa.qq.com/pa?p=1:707321921:4
          # http://wpa.qq.com/pa?p=1:707321921:5
          # http://wpa.qq.com/pa?p=1:707321921:6
          # http://wpa.qq.com/pa?p=1:707321921:7
          # http://wpa.qq.com/pa?p=1:707321921:8
          # http://wpa.qq.com/pa?p=1:707321921:9
          # http://wpa.qq.com/pa?p=1:707321921:10
          # http://wpa.qq.com/pa?p=1:707321921:11
          # http://wpa.qq.com/pa?p=1:707321921:12
          # http://wpa.qq.com/pa?p=1:707321921:13
          5、<img> 圖形標簽
          行級標簽，用來顯示圖片。
          重要屬性有：src、title、alt、width、height、align。
          src 圖片地址。
          title 鼠標懸浮在圖片上的文字。
          alt 圖片找不到時要替換的文字。如果圖片資源使用的是外網資源，則不會顯示要替換的文字。如果使用的是本網站的資源（相對路徑給出），則找不到圖片時會顯示替換的文字，并保留圖片設置的寬高結構。
          align 圖片周圍文字的垂直對齊情況。常用的屬性值有：top（與圖片的頂部對齊）、middle（與圖片的中部對齊）、bottom（默認，與圖片的底部對齊）。
          width 圖片的寬
          height 圖片的高 (寬高兩個屬性只用一個會自動等比縮放.)
          <img src="http://p_w_picpaths.cnblogs.com/cnblogs_com/suoning/845162/o_ns.png" alt="圖片加載失敗。。。" title="The knife girl, kiss"/>
          6、列表標簽　
          <ul> :無序列表標簽
          <li>:列表中的每一項.
          <ol> :有序列表標簽
          <li>:列表中的每一項.
          <li>主要的屬性有：type、value兩個:
          type指明項目的類型，屬性值有：A，a，I，i，1，disc（實心圓），square（實心正方形），circle（空心圓）。
          value表示序號值從幾開始。
          <dl> 定義列表
          <dt> 列表標題
          <dd> 列表項
          <ur>
           <li type="circle">A</li>
           <li type="1">B</li>
           <li type="1">C</li>
          </ur>
          <ol>
           <li value="3">3</li>
           <li>4</li>
          </ol>
          <dl>
           <dt><i>標題</i></dt>
           <dd>第一項</dd>
           <dd>第二項</dd>
           <dd>第三項</dd>
          </dl>
          　　
          7、<table> 表格標簽
          <table border="1">
           <thead>
           <tr>
           <th>序號</th>
           <th>姓名</th>
           </tr>
           </thead>
           <tbody>
           <tr>
           <th>1.</th>
           <td>nick</td>
           </tr>
           <tr>
           <th>2.</th>
           <td>jenny</td>
           </tr>
           </tbody>
          </table>
          <table> 表格標簽
           border:（表格邊框）
           align（水平對齊方式）
           bgcolor（背景顏色）
           cellpadding（內邊距，單元格與內容之間的距離）
           cellspacing（外邊距，單元格的間距，設置為0時，表格變為實線表格）
           width（表格的寬度，可以用%或者像素，最好通過css來設置長寬）
          <caption> 表格的標題
          <tr> 表格的數據行，table row
           <th> 表格的表頭名稱，與<td>不同在于文字采用加粗居中的形式顯示，table head cell
           <td> 單元格，用來顯示表格內容，table data cell
          <thead> 表格頭部，使結構更加分明
          <tbody> 表格主體部分，使結構更加分明
          rowspan 單元格豎跨多少行，作用在th或者td上
          colspan 單元格橫跨多少列（即合并單元格），作用在th或者td上
          <table>
           <caption>xxxxxxxxxx</caption>
           <thead>
           <tr>
           <th>序號</th>
           <th>姓名</th>
           <th>年齡</th>
           <th>女神</th>
           </tr>
           </thead>
           <tbody>
           <tr>
           <th>1.</th>
           <td>nick</td>
           <td>18</td>
           <td>可可西</td>
           </tr>
           <tr>
           <th>2.</th>
           <td>jenny</td>
           <td>21</td>
           <td>nick!!!</td>
           </tr>
           </tbody>
          </table>
          8、<form>表單標簽
          表單屬性
          HTML 表單用于接收不同類型的用戶輸入，用戶提交表單時向服務器傳輸數據，從而實現用戶與Web服務器的交互。表單標簽, 要提交的所有內容都應該在該標簽中。
          屬性：action、method、enctype
          action 表單要提交的地址，用于處理表單的內容（一般是提交字典到后臺的一個接口，這個接口是java寫成的，提交到這個接口后后臺就知道如何處理這些數據了）。
          method 提交的方法，默認是get方式提交。
           get: 1.提交的鍵值對.放在地址欄中url后面. 2.安全性相對較差. 3.對提交內容的長度有限制.
           post:1.提交的鍵值對不在地址欄. 2.安全性相對較高. 3.對提交內容的長度理論上無限制.
          enctype 對表單數據進行編碼，默認都是要編碼的。格式為：application/x-www-form-urlencoded（表單默認的編碼格式，表單發送前對所有字符進行編碼。編碼規則：空格轉換為“+”號，特殊符號轉換為ASC HEX值）。提交普通的文本內容到服務器就可以采用這種默認的編碼方式。當你需要提交的是一個文件時，編碼就需要采用另一種格式：multipart/form-data（不對字符編碼，文件上傳時使用）。text/plain（是一種純文本編碼，空格轉換為“+”號，但是不對特殊字符進行編碼）。
          <!DOCTYPE html>
          <html lang="en">
          <head>
           <meta charset="UTF-8">
           <title>Title</title>
          </head>
          <body>
           <form action="https://www.baidu.com/s">
           <input type="text" name="wd">
           <input type="submit" value="百度一下">
           </form>
          </body>
          </html>
          <!DOCTYPE html>
          <html lang="en">
          <head>
           <meta charset="UTF-8">
           <title>Title</title>
          </head>
          <body>
           <form action="https://www.sogou.com/web">
           <input type="text" name="query">
           <input type="submit" value="搜狗搜索">
           </form>
          </body>
          </html>
          表單元素
          <input> type 屬性：
           text 文本框輸入（默認text文本框類型）。
           autocomplete（自動完成輸入的內容，要求表單元素要有name屬性才有自動完成的效果，off表示自動完成不可用，on表示自動完成可用）
           disabled（設置或者獲取控件的狀態，默認是false即可用，等于true時不可用，不能輸入內容）
          　　　　password 密碼框。（以下屬性text和password共有）
           size（指定表單元素的初始寬度。當type為text或password時，表單元素的大小以字符為單位，對于其他元素，寬度以像素為單位）
           maxlength（type為text或password時，表示輸入的最大字符數），有利于防止sql的注入攻擊
           readonly 只讀.　
          　　　　　　placeholder 框內預置內容(灰色)，寫上內容時才消失
           radio 單選按鈕。屬性：
           name（將name的值設置為相同值，才表示一組數據，才能實現單選功能）
           value（必須要寫，提交到服務器的key值，實際開發過程中value一般是編號）
           checked（是否被選中的狀態）
           checkbox 復選框。
           name（名字一定要一樣一樣的，才表示是一組數據，添加到同一value值列表提交到服務器）
           value（必須要寫，提交到服務器的key值，實際開發過程中value一般是編號）
           checked（是否被選中的狀態）
           file 文件域，上傳文件（不同的瀏覽器表現形式不同）
          　　　　submit 提交按鈕。用于提交表單。
          　　　　reset 重置按鈕。清空表單的輸入，恢復到表單默認的狀態。
           button 普通按鈕。一般結合javascript使用。
          　　　　p_w_picpath 圖片按鈕，用來提交表單，與submit是一樣的效果。
           src（圖片路徑）
          　　　　hidden 隱藏字段。
           value（隱藏的內容）
          　　　　color 顏色標簽。value指定顏色值（采用#十六進制數表示）。
          　　　　date 日期。value值指定默認的日期，格式為****-**-**（年月日）。
          　　　　datetime-local 顯示本地時間，value值指定默認的時間，格式為2016-05-20T11:10:10（年月日T時分秒）。
          　　　　number 數字向上或者向下滑動。可以填數字然后向上或者向下選擇不同的值。
          　　　　range 滑動標簽。min（指定最小值）、max（指定最大值）、value（指定當前默認值）。
          　　　　week 每年的周數。value指定哪一年第幾周，格式為2016-W25（2016年第25周）。
          <textarea> 文本域標簽。默認表現形式是可以輸入很多行文本的文本框。
           name （表單提交項的key）
          　　　　cols（設置文本域寬度）
           rows（設置文本域高度，即行數）
          <select> 下拉框標簽。使用時要結合<option>子標簽一起使用。
           name:表單提交項的key
           size：選項個數
           multiple：多選
           <option> 下拉選中的每一項
           value（表單提交項的值）
           selected（selected下拉選默認被選中）
           <optgroup>為每一項加上分組
          <label> 把元素與文本結合起來
          友好設計：不只是選中復選框才能選中并打鉤，要求點擊對應的文字也能選中該復選框。
          這種情況下要用到<label>標簽的for屬性（設置或獲取給定標簽對象指定到的對象，值=另一個元素的id號即可）
          <label for="name">姓名</label>
          <input id="name" type="text">
          <fieldset> 對表單中的相關元素進行分組 
          <fieldset>
           <legend>溫馨提示</legend>
           <div align="middle">不要忘記點贊哦 ==</div>
          </fieldset>
          value: 表單提交項的值
          對于不同的輸入類型，value 屬性的用法也不同：
           type="button", "reset", "submit" - 定義按鈕上的顯示的文本
           type="text", "password", "hidden" - 定義輸入字段的初始值
           type="checkbox", "radio", "p_w_picpath" - 定義與輸入相關聯的值
          框架
          <frameset> 框架
          用來劃分窗體，不能放在<body>中，否則沒有效果。
           cols （縱向分割頁面。其數值表示方法有三種：“30%、30（或者30px）、*”；數值的個數代表分成的視窗數目且數值之間用“,”隔開。“30%”表示該框架區域占全部瀏覽器頁面區域的30%；“30”表示該區域橫向寬度為30像素；“*”表示該區域占用余下頁面空間。例如：cols="25%,200,*" 表示將頁面分為三部分，左面部分占頁面30%，中間橫向寬度為200像素，頁面余下的作為右面部分。）
           rows（橫向分割頁面。屬性和cols一樣）
           frameborder（設置是否顯示框架邊框。設定值只有0、1；0 表示不要邊框，1 表示要顯示邊框）
           border（框架之間的距離，一般設置為0）
           bordercolor（邊框的顏色）
           framespacing（設置框架與框架間的保留的空白距離）
          <frameset cols="40%,*,*"> 第一個框架占整個瀏覽器窗口的40%,剩下的空間平均分配給另外兩個框架。
          <frameset cols="*,*,*,*"> 瀏覽器窗口等分為四部分。
          <iframe> 框架
          元素會創建包含另外一個文檔的內聯框架（即行內框架）
           name （設置框架名稱。此為必須設置的屬性）
           src （設置此框架要顯示的網頁名稱或路徑。此為必須設置的屬性）
           scrolling （設置是否要顯示滾動條。設定值為auto, yes, no）
           bordercolor （設置框架的邊框顏色）
           frameborder （設置是否顯示框架邊框。設定值只有0、1；0 表示不要邊框，1 表示要顯示邊框）
           noresize （設置框架大小是否能手動調節）
           marginwidth （設置框架邊界和其中內容之間的寬度）
           marginhight （設置框架邊界和其中內容之間的高度）
           width（設置框架寬度）
           height （設置框架高度）
                              	
          
	
	

          

          

 
          
        
        
		  
      
          
      
      
          
    
          
  
          

          



 


			
		





          
  
          
    
  
          

          

          
	
          
		
		
		
          
	
          


          
 

 







主站蜘蛛池模板：
国产精品无码不卡一区二区三区|
无码免费一区二区三区免费播放|
国模丽丽啪啪一区二区|
亚洲国产一区视频|
国产一区中文字幕在线观看|
国产成人无码AV一区二区在线观看|
一区二区三区免费高清视频|
琪琪see色原网一区二区|
亚洲av无码一区二区乱子伦as|
精品国产一区二区三区久久|
国产日韩视频一区|
亚洲AV福利天堂一区二区三
|
国产在线观看一区精品|
日韩一区二区三区射精|
精品一区二区三区AV天堂|
精品国产一区二区三区久久狼|
国产凹凸在线一区二区|
精品日韩在线视频一区二区三区
|
极品人妻少妇一区二区三区|
国产在线乱子伦一区二区|
亚洲一区二区三区夜色|
日韩美一区二区三区|
色一情一乱一伦一区二区三欧美|
国产午夜精品一区理论片飘花|
日本香蕉一区二区三区|
国产一区二区三区日韩精品|
无码精品国产一区二区三区免费|
国产在线观看一区二区三区精品|
国产大秀视频一区二区三区|
亚洲一区二区三区不卡在线播放|
97久久精品无码一区二区|
人妻免费一区二区三区最新|
色婷婷香蕉在线一区二区|
国产精品日韩一区二区三区|
亚洲国产精品一区二区久|
亚洲码欧美码一区二区三区|
任你躁国语自产一区在|
久久精品国产一区二区三区不卡
|
精品无码人妻一区二区三区品
|
免费无码AV一区二区|
亚洲高清美女一区二区三区|