CSS样式未出现在PHP页面上

时间:2019-05-31 04:04:09

标签: php html

我想为网页显示一些样式,但是我为其定义的样式没有出现。

我尝试查看代码,但我编辑的内容似乎无效。

(这是我functions.php页面的一部分。echo是我要设置样式的代码)

    function getPro() {

    global $con;

$get_pro = "select * from products order by RAND() LIMIT 0,6";

$run_pro = mysqli_query($con, $get_pro);

while($row_pro=mysqli_fetch_array($run_pro)) {

    $pro_id = $row_pro['product_id'];
    $pro_cat = $row_pro['product_cat'];
    $pro_brand = $row_pro['product_brand'];
    $pro_title = $row_pro['product_title'];
    $pro_price = $row_pro['product_price'];     
    $pro_image = $row_pro['product_image'];

echo "
        <div id='single_product'>

            <h3><b>$pro_title<b></h3>

            <img src='admin_area/product_images/$pro_image' width='180' height='180' />

            <p><b> $ $pro_price </b></p>

            <a href='details.php' style='float:left;'>Details</a>
            <a href='index.php'> <button style='float:right'>Add to Cart</button></a>


        </div>  ";
}

(这是我的style.css页面中的样式)

   #single_product {float:left; margin-left: 20px; padding:10px;}

   #single_product img {border:4px solid black;}

(这是我执行功能的索引页的一部分)

<div class="content_wrapper">
  <div id="sidebar"> 
    <div id="sidebar_title">Categories</div>

  <ul id="cats">
    <?php getCats(); ?>
  </ul>

 <div id="sidebar_title">Brands</div>
<!-- brands and categories have the same ul id -->
    <ul id="cats">
    <?php getBrands(); ?>
    </ul>
</div>

    <div id="content_area">

        <div id="products_box">

            <?php getPro(); ?>

        </div>

    </div>

</div>

我希望'single_product'的样式设置为在CSS页面中定义的方式。

1 个答案:

答案 0 :(得分:1)

嗨,如果您想定义css use类并给css like

echo "<div class='single_product'>
        <h3><b>$pro_title<b></h3>
        <img src='admin_area/product_images/$pro_image' width='180' height='180' />
        <p><b> $ $pro_price </b></p>
        <a href='details.php' style='float:left;'>Details</a>
        <a href='index.php'> <button style='float:right'>Add to Cart</button></a>
    </div>  ";

--- CSS ---

   .single_product {float:left; margin-left: 20px; padding:10px;}
   .single_product img {border:4px solid black;}

因为您正在使用while循环和CSS在id中定义,这就是为什么不起作用尝试使用类和定义