試圖在html中製作一個四捨五入的方框

由於某種原因，我不斷在我的表格下方得到矩形。有沒有一些方法來測試HTML，而不是一絲不苟地掃描？試圖在html中製作一個四捨五入的方框

<?xml version="1.0" encoding="iso-8859-1" ?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
    <head> 
     <title></title> 
     <link rel="stylesheet" type="text/css" href="./style.css" /> 
    </head> 
    <body> 
     <table width="600" cellpadding="0" cellspacing="5" border="0"> 
      <tr> 
       <td> 
        <table width="200" cellpadding="0" cellspacing="0" border="0"  style="background-color: #0C990A"> 
         <tr> 
          <td width="14"><img src="./images/layout/rounded_corner1.gif" width="14" height="14" border="0" alt="..." /></td> 
         <td width="172"></td> 
         <td width="14"><img src="./images/layout/rounded_corner2.gif" width="14" height="14" border="0" alt="..." /></td> 
        </tr> 
        <tr> 
         <td></td> 
         <td align="center" width = "14" height = "150">Blarzed.Thecom</td> 
         <td></td> 
        </tr> 
        <tr> 
         <td><img src="./images/layout/rounded_corner3.gif" width="14" height="14"border="0" /></td> 
         <td></td> 
         <td><img src="./images/layout/rounded_corner4.gif" width="14" height="14"border="0" /></td> 
        </tr> 
       </table> 
      </td> 
      <td> 
       <table width="200" cellpadding="0" cellspacing="0" border="0" style="background-color: #0C990A"> 
        <tr> 
         <td width="14"><img src="./images/layout/rounded_corner1.gif" width="14" height="14" border="0" alt="..." /></td> 
         <td width="172"></td> 
         <td width="14"><img src="./images/layout/rounded_corner2.gif" width="14" height="14" border="0" alt="..." /></td> 
        </tr> 
        <tr> 
         <td></td> 
         <td align="center"><img src="./images/layout/blarzedbanner.gif" width="600" height="150" border="0"/></td> 
         <td></td> 
        </tr> 
        <tr> 
         <td><img src="./images/layout/rounded_corner3.gif" width="14" height="14"border="0" /></td> 
         <td></td> 
         <td><img src="./images/layout/rounded_corner4.gif" width="14" height="14"border="0" /></td> 
        </tr> 
       </table> 
      </td> 
     </tr> 
</body>

來源

2011-02-15 hedgehogrider

* gasp * TABLES？!! – mattsven 2011-02-15 04:26:52

您在主包裝表上缺少結尾「表格」標籤。快速確定是否有某種類型的拼寫錯誤或通過某種類型的工具驗證HTML/XHTML的方法之一。例如：

http://validator.w3.org/

有跡象表明將插件到瀏覽器像FireBug和Web Developer，在HTML，CSS和Javascript的驗證和調試幫助工具。

作爲一個方面說明，我會忘記做表格並使用DIV標籤，然後將以下CSS應用於任何給定的DIV標籤，您想要圓角。這是您的設計重新使用DIV和CSS完成的。

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Rounded Corners Example</title> 

     <style type="text/css"> 
      .roundedContainer { 
       background-color: #0c990a; 
       border-radius: 10px; 
       -moz-border-radius: 10px; 
       float: left; 
       height: 200px; 
       padding: 0 20px; 
       text-align: center; 
      } 
     </style> 
    </head> 
    <body> 
     <div class="roundedContainer" style="line-height: 200px;">Blarzed.Thecom</div> 
     <div class="roundedContainer"><img src="/images/layout/blarzedbanner.gif" alt="Blarzed Banner"></div> 
    </body> 
</html>

該代碼可能需要進行一些調整，但這會讓你在那裏一半。

來源

2011-02-15 04:46:37 Mateo

你可以試試Firebug Firefox擴展。

有很多方法可以使用它。在你的情況下，爲了查看角落圖像是否真的被加載並渲染到你認爲它們的位置，你可以觸發螢火蟲，瀏覽DOM樹，甚至點擊頁面的某個區域來查看HTML元素的後面。

來源

2011-02-15 04:25:56

試圖在html中製作一個四捨五入的方框

回答

相關問題