google控制台下移动到元素下出现对的box的
html:
事件标题 | 备注 | 事件时间 | 闹钟时间 | 闹钟还剩 | 状态 | 操作 |
css:
.home-message{ height:285px; width:100%; margin:0 auto; border-width:1px; border-style: solid; border-color:#dbdee1; font-size: 11px; } .ev-show-title{ color:#62adf9; font-weight:bold; border-collapse:collapse; } .ev-task-title,.ev-eventime-title,.ev-clocktime-title,.ev-neartime-title,.ev-status-title,.ev-openrate-title,.ev-memo-title{ height:30px; border-width: 0px 1px 0px 0px; border-color:#dbdee1; border-style: solid; text-align:center; } td.ev-task-title{width:120px; } td.ev-memo-title{width:80px;display:none;} td.ev-eventime-title{width:150px;} td.ev-clocktime-title{width:120px;} td.ev-neartime-title{width:90px;} td.ev-status-title{width:50px;} td.ev-openrate-title{width:81px;}
上面的问题已经解决。我是因为在使用table元素之前的pcss式样影响了其布局。
心得:遇见这种问题网上查不到的问题。可先确认一下是不是上面的p的css式样导致table布局出现问题。(通过注释掉前面的代码,来确认table布局布局有没有恢复正常,如果是在一段段注释代码来精准定位是那段代码影响的。)
说一个思路
表格的布局算法有两种
一种是自适应算法 (影响因素较多,难控制)
一种是固定布局 (易控制, 使用繁琐)