关于html中空格导致的排版问题_html/css_WEB-ITnose
- WBOY原创
- 2016-06-24 11:45:561071浏览
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head> <title>#{Security}</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"/> <style type="text/css"> html { height:100%; margin:0; } body { height:95%; margin:0; padding-top: 30px; padding-left: 60px; } select, input[type="text"] { height: 22px; } #lineNum { width: 60px; } .actionTable { width: 100%; } </style></head><body style="margin:0; -moz-user-select:-moz-none;" onselectstart="return $.Util.isSelected(event);" > <div style='width:850px;'> <table class="noBorderTable actionTable"> <tr> <td> <label>文件:</label> <select id="file" name="file" style="width: 180px;"> #{files.options} </select> <label>行数:</label> <input id="lineNum" name="lineNum" type="text" value="500" style="width: 120px;" onkeyup='property(event, this);'/> <label id="errMsg" style="color: red;"></label> <input id="isAll" name="isAll" type="checkbox" onclick="checkAuditRefresh()" style="text-align:center; vertical-align:middle"/> <label>全部显示</label> <input id="refresh" name="auto-refresh" type="checkbox" onclick="checkAuditRefresh()" style="text-align:center; vertical-align:middle"/> <label>自动刷新</label> </td> <td style="text-align: right;"> <input type="button" id="rotate" value="分割文件"/> <input type="button" id="download" value="下载"/> <input type="button" id="gainLog" value="刷新"/> </td> </tr> </table> <div style='width:400px;margin-top:5px;'> </div> </div></body></html> 页面效果
问题。
如上图，下拉列表的id为“file”，它与“行数”之间的间距为24px。而上图为上述图片，为上述代码的效果图。发现在未对其格式进行特殊设置的时候，页面上下拉列表与“行数”之间就存在间隙。而我如果将与“ ”写在同一行且之间无空格，两者之间就不会再有间隙。
结论：它们之间的间隙是因为标签“”与标签“
延伸：如果才能是这一区域内的空格或换行失去作用？
声明：
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn