Fatal编程技术网
  • html/
  • Html 为什么桌子的一些边框消失了？

Html 为什么桌子的一些边框消失了？

html css

Html 为什么桌子的一些边框消失了？,html,css,html-table,Html,Css,Html Table,在chrome浏览器的移动模式下，它就是这样一个简单的表格显示，但是td的一些边框没有显示出来，如图所示。 谁能告诉我为什么 AAAAA ul，ol{列表样式：无；} 阀体，h1，h2，h3，h4，h5，h6，hr，p，blockquote， dl，dt，dd，ul，ol，li， 之前， 表单、字段集、图例、按钮、输入、文本区域、， th，td，tr{ 保证金：0； 填充：0； } ul，ol{列表样式：无；} 桌子{ 边界半径：4px； 颜色：#000； 边界塌陷：塌陷； 宽度：100%；

在chrome浏览器的移动模式下，它就是这样一个简单的
表格
显示，但是
td
的一些边框没有显示出来，如图所示。 谁能告诉我为什么


AAAAA
ul，ol{列表样式：无；}
阀体，h1，h2，h3，h4，h5，h6，hr，p，blockquote，
dl，dt，dd，ul，ol，li，
之前，
表单、字段集、图例、按钮、输入、文本区域、，
th，td，tr{
保证金：0；
填充：0；
}
ul，ol{列表样式：无；}
桌子{
边界半径：4px；
颜色：#000；
边界塌陷：塌陷；
宽度：100%；
表布局：固定
}
表td，th{
空白：nowrap；
溢出：隐藏；
文本溢出：省略号；
填充：6px；
边框：1px实心#ccc；
}
AAAAA
AAAAA
AAAAA
AAAAA
AAAAA
AAAAA
AAAAA
AAAAA
AAAAA
AAAAA
AAAAA
AAAAA
它似乎适合我。在chrome移动模式下，手机周围都有边框。你的chrome版本是什么？你在实际的移动设备上试用过吗？这可能只是chrome手机视图中的一个渲染问题，无法复制它。当我更新我的chrome时，你可以在这里查看，看起来还可以，哈哈，也许我是个傻瓜。。。 
 <!DOCTYPE html >
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>AAAAAA</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css" />
    <script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
    <style>
        ul, ol { list-style: none; }
    body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, 
    dl, dt, dd, ul, ol, li, 
    pre, 
    form, fieldset, legend, button, input, textarea, 
    th, td ,tr{
        margin: 0;
        padding: 0;
    }
    ul, ol { list-style: none; }
    table{
        border-radius: 4px;
        color: #000;
        border-collapse:collapse;
        width: 100%;
        table-layout:fixed
    }
    table td,th{
         white-space:nowrap;
        overflow:hidden;
        text-overflow:ellipsis;
        padding:6px;
        border:1px solid #ccc;
    }
 </style>
</head>
<body>
    <form name="form1" method="post" action="#" id="form1">
    <div data-role = "page">
    <div data-role = "content">
            <table>
               <tr>
                   <th>AAAAAAAA</th>
                   <th>AAAAAAAA</th>
                   <th>AAAAAAAA</th>
                   <th>AAAAAAAA</th>
                   <th>AAAAAAAA</th>
                   <th>AAAAAAAA</th>
               </tr> 
               <tr>
                   <td>AAAAAAAA</td>
                   <td>AAAAAAAA</td>
                   <td>AAAAAAAA</td>
                   <td>AAAAAAAA</td>
                   <td>AAAAAAAA</td>
                   <td>AAAAAAAA</td>
               </tr>
            </table>        
        </div>
    </div>
    </form>
</body>    
</html>