首先,本項(xiàng)目中使用的是bootstrap框架,因此有些人會(huì)說(shuō),給表格設(shè)置自適應(yīng)屬性就可以了
這里要申明的是
bootsrtap自適應(yīng)是針對(duì)當(dāng)瀏覽器不占滿整個(gè)屏幕,而是一半的時(shí)候才會(huì)出現(xiàn)橫向的滾動(dòng)條
而當(dāng)我們將瀏覽器最大化的時(shí)候,如果列數(shù)增多了呢?會(huì)出現(xiàn)什么效果
答案就是會(huì)出現(xiàn)擠壓的效果,橫向并不會(huì)出現(xiàn)滾動(dòng)條
查看網(wǎng)上的教程,很多人都說(shuō)將什么父div設(shè)置100%,table添加scrool屬性均不可
這里,解決的方法很簡(jiǎn)單,設(shè)置th>標(biāo)簽的屬性即可,讓其不要自動(dòng)換行
$(document).ready(function() {
$("th").css("white-space","nowrap");
});
來(lái)設(shè)置頁(yè)面加載完成后th標(biāo)簽不允許自動(dòng)換行的屬性即可
注意在css中使用的是這個(gè)屬性,和在th標(biāo)簽中使用不一樣,th標(biāo)簽中使用方法如下
th nowrap="nowrap">也可實(shí)現(xiàn)不自動(dòng)換行
以上就是小編為大家?guī)?lái)的jsp中為表格添加水平滾動(dòng)條的方法的全部?jī)?nèi)容了,希望對(duì)大家有所幫助,多多支持腳本之家~
您可能感興趣的文章:- js網(wǎng)頁(yè)滾動(dòng)條滾動(dòng)事件實(shí)例分析
- 原生JS綁定滑輪滾動(dòng)事件兼容常見瀏覽器
- js監(jiān)聽滾動(dòng)條滾動(dòng)事件使得某個(gè)標(biāo)簽內(nèi)容始終位于同一位置
- js鼠標(biāo)滑輪滾動(dòng)事件綁定的簡(jiǎn)單實(shí)例(兼容主流瀏覽器)
- jsp中為表格添加水平滾動(dòng)條的實(shí)現(xiàn)方法
- jsp中實(shí)現(xiàn)帶滾動(dòng)條的table表格實(shí)例代碼
- JS實(shí)現(xiàn)拖動(dòng)滾動(dòng)條評(píng)分的效果代碼分享
- JS 滾動(dòng)事件window.onscroll與position:fixed寫兼容IE6的回到頂部組件