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 国产一级特黄在线播放,波多野结衣1区,一区二区三区高清不卡 

      

        

          



          
	
          
		
          
			
			
          
				
          整合營(yíng)銷服務(wù)商
          
				
          電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
          
			
          
			
          				
				
          免費(fèi)咨詢熱線：
          			
			
          
		
          
	
          
		
	
	
	

          


          
	

          

 

          
  
          
    
          
      
          
        
          HTML+CSS：曾輝煌一時(shí)的table，詳解table標(biāo)簽的語法與使用
          
        
           
          
	
	
          
		
                        
          篇文章介紹了div標(biāo)簽的作用，我們這篇文章主要來看下過氣表格標(biāo)簽table的語法與使用。
          1）table的曾經(jīng)
          在div沒有出現(xiàn)之前，table曾是做網(wǎng)頁的中堅(jiān)力量。記得在開始學(xué)網(wǎng)頁的時(shí)候，div是神馬，我不造呀！做網(wǎng)頁還用div嗎，就只用table就可以了，各種表格嵌套加嵌套，一個(gè)網(wǎng)頁就拼湊出來了。但table寫的布局頁面做維護(hù)就比較令人頭痛欲裂了。因?yàn)閠able是一層一層嵌套，標(biāo)簽量冗余過多。所以修改起來就是動(dòng)一發(fā)而牽全身。維護(hù)起來格外麻煩，往往是拆東墻補(bǔ)西墻。所以它后來就慢慢被div所替代。但是在數(shù)據(jù)列表上還是用table形式來寫比較的合理，所以現(xiàn)在table多用于網(wǎng)站后臺(tái)的表格數(shù)據(jù)處理中。
          2）表格標(biāo)簽table使用
          簡(jiǎn)單的表格由table元素以及一個(gè)或多個(gè)tr（行標(biāo)簽）、th（表頭單元格標(biāo)簽）、td（普通單元格標(biāo)簽）等標(biāo)簽所組成，當(dāng)然復(fù)雜的表格還包括caption（表格標(biāo)題）、col(定義列)、colgroup(對(duì)表格中的列進(jìn)行組合)、thead（組合表頭的內(nèi)容）tbody(組合表格的主題內(nèi)容)、tfoot(組合表格的腳注內(nèi)容)等這里我們先簡(jiǎn)單了解下即可。
          定義表格：<table></table>
          創(chuàng)建表行：<tr></tr>
          創(chuàng)建列(單元格):<th></th>（表頭）、<td></td>（表格單元） 
          注意：默認(rèn)情況下，每行中的列數(shù)是統(tǒng)一的。
          比如我們想創(chuàng)建一個(gè)姓名、年齡、分?jǐn)?shù)和日期的數(shù)據(jù)表格，并設(shè)置border為1，我們可以使用table來制作。具體的表格代碼如下圖所示：
          在網(wǎng)頁中呈現(xiàn)的效果就如下圖所示：
          3）為表格添加簡(jiǎn)單樣式
          這時(shí)候有的人就會(huì)說了，為什么這個(gè)表格看起來這么奇怪，邊框都是有空隙的呢？我們只需要給表格添加一些特殊的樣式，即可制作一個(gè)比較漂亮好看的表格了。添加的樣式代碼：
          在網(wǎng)頁中呈現(xiàn)的效果就如下圖所示：
          現(xiàn)在我們的表格是不是看著比較的清新了，上面的css代碼中為表格添加了背景、邊框以及去掉了粗的邊線。具體的css代碼我們會(huì)在以后的課程中為大家介紹，大家在這里只需要知道并了解table標(biāo)簽的作用以及使用就可以了。沒事可以多用table寫一寫表格，熟能生巧。
          附贈(zèng)一句經(jīng)典語錄：每天早上，你有兩個(gè)簡(jiǎn)單的選擇：是睡回籠覺，還是起身追逐 夢(mèng)想 。喜歡我的文章的小伙伴記得關(guān)注一下哦，每天將為你更新最新知識(shí)。
          天，小編為大家展示一下，用純table搭建頁面結(jié)構(gòu)，實(shí)現(xiàn)QQ登陸頁（為初學(xué)者作參考,頁面結(jié)構(gòu)搭建方式很多，這種基本上就只初學(xué)table才會(huì)用的）
          小編的素材
          上代碼截圖：
          有興趣的同學(xué)可以去試試吧。
          更多基礎(chǔ)練習(xí)案例，私信小編回復(fù)“html”獲得。
          序列表和有序列表
          用于呈現(xiàn)邏輯上并列的具有相關(guān)性的數(shù)據(jù)內(nèi)容.
          <ul>
          <li></li>
          </ul>
          ul元素可以用type屬性設(shè)置不同的列表標(biāo)記:
          disc: 實(shí)心圓點(diǎn)
          circle: 空心圓圈
          square: 實(shí)心正方形
           
          <ol>
          <li></li>
          </ol>
          ol元素也可以設(shè)置不同的標(biāo)記:
          1: 阿拉伯?dāng)?shù)字
          i: 小寫羅馬數(shù)字
          I: 大寫羅馬數(shù)字
          A: 大寫字母
          a: 小寫字母
          定義列表
          適用呈現(xiàn)包含主題及描述的數(shù)據(jù)內(nèi)容.
          <dl>
          <dt>主題</dt>
          <dd>描述</dd>
          </dl>
          表格
          <table>
           <thead>
           <tr>
           <th></th>
           </tr>
           </thead>
           <tbody>
           <tr>
           <td></td>
           </tr>
           </tbody>
          </table>
           
          thead: 表頭
          tbody: 表體
          tfoot: 表腳
          th: 專用于表頭中的單元格, 其具有自動(dòng)加粗并且居中的效果.
           
          表格的屬性控制:
          border: 邊框
          bordercolor: 邊框顏色
          width: 寬度
          height: 高度
          cellspacing: 單元格間距(外)
          cellpadding: 單元格填充(內(nèi))
          align: 表格的位置控制
           
          單元格的屬性控制:
          align
          valign
           
          如何合并單元格/跨行或跨列?
          <td rowspan="number" colspan="number">
          注意: 合并后, 會(huì)引發(fā)單元格數(shù)量的減少!
          列表練習(xí)案例源碼：

          <!DOCTYPE html>
          <html>
           <head>
           <meta charset="UTF-8">
           <title></title>
           </head>
           <body>
           <h1>我的電腦文件列表</h1>
           <ul>
           <li>我的電腦
           <ul>
           <li>本地磁盤(C:)
           <ul>
           <li>我的文檔</li>
           <li>我的收藏</li>
           </ul>
           </li>
           <li>本地磁盤(D:)
           <ul>
           <li>我的游戲</li>
           <li>我的資料</li>
           <li>我的電影</li>
           </ul>
           </li>
           </ul>
           </li>
           </ul>
           </body>
          </html>
                              	
          
	
	

          

          

 
          
        
        
		  
      
          
      
      
          
    
          
  
          

          



 


			
		





          
  
          
    
  
          

          

          
	
          
		
		
		
          
	
          


          
 

 







主站蜘蛛池模板：
国产一区在线视频观看|
日韩最新视频一区二区三|
国产日韩AV免费无码一区二区
|
eeuss鲁片一区二区三区|
一区在线观看视频|
中文字幕一区二区三区人妻少妇|
精品少妇一区二区三区在线
|
国产精品日本一区二区在线播放|
国产怡春院无码一区二区|
久久久精品人妻一区二区三区
|
日韩视频在线一区|
亚洲熟女www一区二区三区
|
国产在线一区二区杨幂|
国产成人综合一区精品|
亚洲国产精品一区二区成人片国内|
一区二区三区视频在线播放|
免费一区二区视频|
精品亚洲AV无码一区二区三区
|
一区二区三区国产|
日韩一区二区三区射精|
农村乱人伦一区二区|
精品国产毛片一区二区无码|
麻豆国产在线不卡一区二区|
国产福利一区二区三区视频在线|
激情一区二区三区|
亚洲男人的天堂一区二区|
国产情侣一区二区|
中文字幕av日韩精品一区二区|
国产亚洲综合一区柠檬导航|
日本不卡免费新一区二区三区|
国产精品女同一区二区久久|
97精品国产一区二区三区|
一区二区三区午夜|
精品成人一区二区三区免费视频|
精品亚洲A∨无码一区二区三区|
国产成人一区二区三区在线|
一区二区三区中文|
亚洲第一区在线观看|
波多野结衣av高清一区二区三区|
日本无卡码免费一区二区三区|
久久精品免费一区二区喷潮|