Home >Web Front-end >HTML Tutorial >How do you say it? It should be said that it is a style problem. Thank you for your help_html/css_WEB-ITnose
How do you say it? It should be said that it is a style problem. Thank you for your help_html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 11:47:50930browse
body{ font-family: "宋体", Verdana, Arial; font-size: 12px; margin: 0px; background: #CED7F7;}.table_border{ border:solid 1px #C4CCD6; background-color:#FFFFFF;}th{ font-weight:bold; font:12px; background-image:url(admin_bg_1.gif); background-repeat:repeat-x; color:white; background-color:4455AA; height:25px;}td{ font:"宋体" 12px; line-height: 20px; line-height: 150%; table-layout: fixed;}input{ border:#7F9DB9 solid 1px; background: #FFF; font-size:12px;}span.tip{ font-size:12px; position:static;} <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>无标题文档</title><link rel="stylesheet" type="text/css" href="style.css"><script src="jquery-1.7.2.js" type="text/javascript"></script><style type="text/css">.even{ background-color:#E4EDF9;}.odd{ background-color:#FFFFFF;}</style><script type="text/javascript">$(document).ready(function(){ //隔行表色 $("tr:even").addClass("even"); $("tr:odd").addClass("odd"); });</script><body> <form id="form1" runat="server"> <table align="center" cellpadding="1" cellspacing="1" class="table_border" width="98%"> <tr height="22" align="center"> <td align="left" class="forumRow" width="40%"> 当前位置：设置 </td> </tr> </table> <br /> <table width="98%" border="0" cellpadding="5" cellspacing="0" align="center" class="table_border"> <tr> <th colspan="2" valign="middle">设置</th> </tr> <tr> <td align="right" width="40%">文件名称:</td> <td align="left" width="60%"><input type="text"></td> </tr> <tr> <td align="right" width="40%">文件路径:</td> <td align="left" width="60%"><input type="text"></td> </tr> <tr> <td align="right" width="40%">图片路径:</td> <td align="left" width="60%"><input type="text"></td> </tr> </table> </form></body></html> The background image is high enough
I just want to know where the extra 10 comes from
I can’t find the problem.
Reply to the discussion (solution)
It should be the reason for the browser’s default padding and margin.
You did not reset the stylesheet initially.
tr, th{
margin: 0;
padding: 0;
}
In addition, for front-end style debugging, it is inevitable to use tools such as firebug, so get familiar with it.
It should be the default padding and margin of the browser.
You did not reset the stylesheet initially.
tr, th{
margin: 0;
padding: 0;
}
In addition, for front-end style debugging, it is inevitable to use tools such as firebug, so get familiar with it.
I have never used tools like firebug for this~ Are there other tools?
And why not add
tr, th{
margin: 0;
padding: 0;
}
Isn’t the default 0?
The th element defaults to padding:5px;
You can reset it
th
{
font- weight:bold;
font:12px;
background-image:url(admin_bg_1.gif);
background-repeat:repeat-x;
color:white;
background-color: 4455AA;
height:25px;
padding: 0px;
}
Got it~ Got it