2011-12-03 27 views
0

我從virtmart(Joomla擴展)組件獲得了以下代碼。該腳本屬於特定功能,用於顯示數據庫中的「產品類型」信息。如果您仔細閱讀下面的代碼,您將看到代碼正在查詢數據庫,然後將數據顯示爲表格。當我運行腳本時,表格看起來非常簡單。我想讓表格看起來像我在下面發佈的圖片中的表格。如何設計PHP標籤內的HTML表格?

我試圖添加一些CSS的表格在我從中獲得代碼的頁面中,但是當我打開頁面時,它的佈局變得更加難看。所以我必須在下面的代碼中添加或做任何更改。

我對PHP和CSS沒有很好的瞭解。對於下表中看起來像我在下面發佈的圖片中的表格,需要做些什麼修改/添加?

$html .= "<br />\n<table width=\"100%\" cellspacing=\"0\" cellpadding=\"0\" border=\"1\">\n"; 
    $html .= "<tr><td colspan=\"2\"><strong>".$VM_LANG->_('PHPSHOP_PRODUCT_TYPE_PARAMETERS_IN_CATEGORY'). ": ".$dbag->f("product_type_name")."</strong></td></tr>\n"; 

    // SELECT parameter value of product 
    $q2 = "SELECT * FROM #__{vm}_product_type_".$dbag->f("product_type_id"); 
    $q2 .= " WHERE product_id='$product_id'"; 
    $dbp->query($q2); 

    // SELECT parameter of Product Type 
    $dba->query($q.$dbag->f("product_type_id")." ORDER BY parameter_list_order"); 
    $i = 0; 
    while ($dba->next_record()) { 
     if ($i++ % 2) { 
      $bgcolor='row0'; 
     } 
     else { 
      $bgcolor='row1'; 
     } 
     $html .= "<tr class=\"$bgcolor\" height=\"18\">\n"; 
     $html .= "<td width=\"30%\">".$dba->f("parameter_label"); 
     $parameter_description = $dba->f("parameter_description"); 
     if (!empty($parameter_description)) { 
      $html .= "&nbsp;"; 
      $html .= vmToolTip($parameter_description, $VM_LANG->_('PHPSHOP_PRODUCT_TYPE_PARAMETER_FORM_DESCRIPTION')); 
     } 
     $html .= "</td>\n<td>"; 
     $html .= $dbp->f($dba->f("parameter_name"))." ".$dba->f("parameter_unit")."</td></tr>\n"; 
    } 
    $html .= "</table>\n"; 
} 
return $html; 

表格圖像

Enter image description here

+0

你真的不希望這樣做。這就是PHP腳本在過去糟糕的日子裏的寫作方式,結果導致代碼不可維護,設計也不穩定。自從將工作層與提供輸出的層分離開以來,已經有了多年的努力。 – GordonM

+0

此外,您的代碼已廣泛開放給SQL注入。不要使用字符串聚合建立SQL查詢! http://bobby-tables.com/ – GordonM

回答

-2

你應該去通過W3Schools教程CSS Tables與CSS樣式表。

+1

任何人都不應該通過任何關於W3Fools的教程。 – GordonM

0

首先我真的推薦你學習PHP和HTML。查看此網頁以瞭解PHP,HTML和CSS:http://www.w3schools.com/

在您的示例中,$html .= "blabla"表示將blabla添加到變量$html。這個PHP腳本使得表格在HTML中應該是完美的。你必須改變CSS。在這裏您可以更改顏色和樣式以及文本字體大小等。根據你所提供的信息,直到現在我真的不能幫你。

因此,我建議您學習CSS,讓您在運行網頁並自己創建表格時獲得源代碼。由於CSS學習時間不長,因此學習如何編輯已有的CSS文檔花費的時間更少。

看看這裏的CSS:http://www.w3schools.com/css/

看看這裏的表中的CSS:http://www.w3schools.com/css/css_table.asp

+0

@ 50ndr33你的評論也不合適。請記住以同樣的尊重對待其他社區成員。 downvote不是稱某人爲小孩和/或白癡的理由。 –