向table添加水平滚动条

转自:http://www.cnblogs.com/linjiqin/p/3148225.html

向table添加水平滚动条_第1张图片

复制代码
DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
 <head>
  <title>给table新增水平滚动条title>
  <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
  <meta http-equiv="description" content="this is my page">
  <meta http-equiv="content-type" content="text/html; charset=gbk-123">
 
        <style type="text/css" mce_bogus="1">  
  table th{
       
            white-space: nowrap;
        }
        table td{
       
            white-space: nowrap;
        }
        body,table{
       
         font-size:12px;
        }
  table{
       
         empty-cells:show; 
         border-collapse: collapse;
         margin:0 auto;
        }
 
  h1,h2,h3{
       
   font-size:12px;
   margin:0;
   padding:0;
  }
  table.tab_css_1{
       
   border:1px solid #cad9ea;
   color:#666;
  }
  table.tab_css_1 th {
       
   background-image: url("th_bg1.gif");
   background-repeat:repeat-x;
   height:30px;
  }
  table.tab_css_1 td,table.tab_css_1 th{
       
   border:1px solid #cad9ea;
   padding:0 1em 0;
  }
  table.tab_css_1 tr.tr_css{
       
   background-color:#f5fafe;
   height:30px;
  }
    style>
    head>
    <body>
    <div style="overflow: auto; width: 100%;">
        <table border="1" class="tab_css_1">
             <thead>
       <th>序号th>
       <th>地市th>
       <th>区县th>
       <th>门店名称th>
       <th>对应直供客户名称th>
       <th>虚拟账号th>
       <th>门店负责人th>
       <th>联系方式th>
       <th>面积th>
       <th>店面属性th>
       <th>营业人数th>
       <th>月销量th>
       <th>月开卡量th>
       <th>对应渠道督导th>
       <th>是否有营业执照th>
     thead>
     <tr class="tr_css" align="center">
                 <td>1td>
     <td>泉州td>
     <td>南安td>
     <td>系统公司td>
     <td>终端门店td>
     <td>林计钦td>
     <td>qz1891234567td>
     <td>1891234567td>
     <td>20td>
     <td>直营店td>
     <td>5td>
     <td>50td>
     <td>40td>
     <td>张三td>
                 <td>td>
     tr>
     <tr class="tr_css" align="center">
                 <td>2td>
     <td>泉州td>
     <td>安溪td>
     <td>安溪铁观音集团td>
     <td>御品仙茶业td>
     <td>林计钦td>
     <td>qz1891234567td>
     <td>1891234567td>
     <td>20td>
     <td>直营店td>
     <td>5td>
     <td>50td>
     <td>40td>
     <td>张三td>
                 <td>td>
     tr>
        table>
    div>
    body>
html>
复制代码

 

转载于:https://www.cnblogs.com/lvchenfeng/p/5295869.html

你可能感兴趣的:(向table添加水平滚动条)