我是一个相当初级的php。这是我的第一个个人项目，只是为了练习。它应该是一个非常简单的电子商店。我想做一个目录的几个产品，所以我创建了数组与一些值。我想添加一个图片到每个产品，这工作完美。只要我使用HTML表情符号。但我想有真实的的图片在那里。不知何故，我想出了办法，但我有我的CSS在一个单独的文件和风格编辑适用于HTML表情符号，但没有根本不适用于jpg图片。
有人能帮我解决这个问题吗？我想样式的图像仍然在CSS文件中。我使用的php代码如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Eshop</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<?php
$TV = ["id" => "1", "name" => "TV", "img" => "<img src='img/TV.jpg'>", "price" => "1000 USD"];
$Computer = ["id" => "1", "name" => "Computer", "img" => "<img src='img/computer.jpg'>", "price" => "2000 USD"];
$Laptop = ["id" => "1", "name" => "Laptop", "img" => "<img src='img/laptop.jpg'>", "price" => "750 USD"];
$Camera = ["id" => "1", "name" => "Camera", "img" => "📷", "price" => "500 USD"];
$Phone = ["id" => "1", "name" => "Phone", "img" => "📱", "price" => "400 USD"];
$Smartwatch = ["id" => "1", "name" => "Smartwatch", "img" => "⌚", "price" => "300 USD"];
$catalog = array ($TV, $Computer, $Laptop, $Camera, $Phone, $Smartwatch);
foreach ($catalog as $item){
echo
"<div class='catalog-item'>
<div class='catalog-img'>
".$item ["img"]."
</div>
<div>
".$item ["name"]."
</div>
<div>
".$item ["price"]."
</div>
<div>
Buy
</div>
</div>";
// print_r($item);
// echo "<br>";
}
?>
and this is what I got in my CSS file:
.catalog-item {
width: 200px;
height: 300px;
background: rgb(65, 177, 214);
margin: 5px;
font-size: 15px;
font-family: Arial;
box-sizing: border-box;
text-align: center;
}
body {
display: flex;
}
.catalog-img {
display: block;
width: 200px;
height: 150px;
font-size: 100px;
font-family: Arial;
box-sizing: border-box;
}
1条答案
按热度按时间watbbzwu1#
我的回答主要是关于修复代码
现在只需要创建一个名为product-image的类，然后就可以将css应用到该类。.product-image img {// your values here}