制作DIV表格行之有效的方法
作者:laicongcong
DIV元素是用來為HTML文檔內(nèi)大塊(block-level)的內(nèi)容提供結(jié)構(gòu)和背景的元素,那你對(duì)DIV表格的概念是否熟悉,這里和大家分享一下制作DIV表格方法。
本文向大家簡(jiǎn)單介紹一下制作DIV表格的方法,用DIV做表格用到的樣式比較多,這里介紹一個(gè)簡(jiǎn)單的表格制作方法,缺點(diǎn)是沒有豎線分隔。但是代碼簡(jiǎn)單且可以作出表格的功能,相信本文介紹一定會(huì)讓你有所收獲。
DIV表格制作方法
用DIV做表格用到的樣式比較多,這里介紹一個(gè)簡(jiǎn)單的DIV表格制作方法,缺點(diǎn)是沒有豎線分隔。但是代碼簡(jiǎn)單且可以作出DIV表格的功能。
- <html>
- <head>
- <title>test</title>
- <styletypestyletype="text/css">
- #border-b{height:18px;}
- #border-bul{clear:both;margin:0;height:18px;}
- #border-bulli{border-bottom:#000solid1px;
- float:left;list-style-type:none;width:65px;}
- </style>
- </head>
- <body>
- <dividdivid="border-b">
- <ul>
- <li> </li>
- <li> </li>
- <li> </li>
- </ul>
- <ul>
- <li> </li>
- <li> </li>
- <li> </li>
- </ul>
- <ul>
- <li> </li>
- <li> </li>
- <li> </li>
- </ul>
- <ul>
- <li> </li>
- <li> </li>
- <li> </li>
- </ul>
- </div>
- </body>
- </html>
但如果是制作數(shù)據(jù)陳列顯示,推薦還是利用DIV結(jié)合table標(biāo)簽應(yīng)用。
【編輯推薦】
- CSS解決DIV居中相關(guān)問題
- JavaScript動(dòng)態(tài)創(chuàng)建div屬性和樣式
- CSS中border和clear兩大屬性用法揭秘
- 實(shí)現(xiàn)DIV居中布局三種途徑
- 解讀DIV CSS網(wǎng)頁布局中CSS無效十個(gè)原因
責(zé)任編輯:佚名
來源:
hi.baidu.com