Задание:
Используя данный массив, вывести с помощью foreach блок div с классом block-info
<?
$info = [
0 => [
"name" => "Mercedes-Benz S 320",
"info" => "Литые диски, тонировка, багажник, ксенон, дневные ходовые огни, омыватель фар, обогрев зеркал, кожа, дерево, алькантара, аудиосистема, встроенный телефон, CD, CD-чейнджер, MP3, ГУР, ABS, SRS, зимний режим, спортивный режим, турбонаддув, иммобилайзер, полный электропакет, центрозамок, климат-контроль, круиз-контроль, бортовой компьютер, мультируль, подогрев сидений, подогрев задних сидений, вентиляция сидений, память руля, парктроники, датчик света, пневмоподвеска, изменяемый клиренс, налог уплачен, техосмотр пройден.",
"img" => "http://e.photos.kl.kcdn.kz/21/c360fff05b3eb217a41e20a6c9cbce/2-400x300.jpg"
],
1 => [
"name" => "Mercedes-Benz S 500",
"info" => "Люк, ксенон, дневные ходовые огни, кожа, бесключевой доступ, камера заднего вида, налог уплачен, техосмотр пройден.<br>Не работают парктроники и дистроник. Торг.",
"img" => "http://d.photos.kl.kcdn.kz/ef/bf2f4c5b672b76b0d0729e0c64d6ef/1-400x300.jpg"
],
2 => [
"name" => "Porsche Cayenne",
"info" => "Панорамная крыша, алькантара, изменяемый клиренс.<br>аэродинамический обвес Sport Design, PASM (Porsche Active Suspension Management), PDCC (Porsche Dynamic Chassis Control). Porsche Cayenne GTS фирменного для этой модели цвета Carmine Red. Авто в отличном состоянии, обслуживается на официальном сервисе",
"img" => "http://e.photos.kl.kcdn.kz/c2/de3895b8a2808c05c0a68c41a7da58/2-400x300.jpg"
],
3 => [
"name" => "Toyota Land Cruiser",
"info" => "Новый авто 2015 года, без пробега абсолютно! Черный и белый. Максимальная комплектация 7 мест. Гарантия 2 года.",
"img" => "http://d.photos.kl.kcdn.kz/ca/469c35e1e9e5c996f8713e1879336c/1-400x300.jpg"
],
];
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<style>
.block-info {
width: 500px;
border: solid 1px #111;
display: block;
position: relative;
padding-left: 120px;
}
.block-info img {
position: absolute;
left: 10px;
top: 10px;
display: inline;
width: 100px;
}
</style>
<div class="block-info">
<img src="http://d.photos.kl.kcdn.kz/ca/469c35e1e9e5c996f8713e1879336c/1-400x300.jpg" alt="Toyota Land Cruiser">
<h3>Toyota Land Cruiser</h3>
<p>Новый авто 2015 года, без пробега абсолютно! Черный и белый. Максимальная комплектация 7 мест. Гарантия 2 года.</p>
</div>
</body>
</html>
[spoiler title=»Решение»]
<?
$info = [
0 => [
"name" => "Mercedes-Benz S 320",
"info" => "Литые диски, тонировка, багажник, ксенон, дневные ходовые огни, омыватель фар, обогрев зеркал, кожа, дерево, алькантара, аудиосистема, встроенный телефон, CD, CD-чейнджер, MP3, ГУР, ABS, SRS, зимний режим, спортивный режим, турбонаддув, иммобилайзер, полный электропакет, центрозамок, климат-контроль, круиз-контроль, бортовой компьютер, мультируль, подогрев сидений, подогрев задних сидений, вентиляция сидений, память руля, парктроники, датчик света, пневмоподвеска, изменяемый клиренс, налог уплачен, техосмотр пройден.",
"img" => "http://e.photos.kl.kcdn.kz/21/c360fff05b3eb217a41e20a6c9cbce/2-400x300.jpg"
],
1 => [
"name" => "Mercedes-Benz S 500",
"info" => "Люк, ксенон, дневные ходовые огни, кожа, бесключевой доступ, камера заднего вида, налог уплачен, техосмотр пройден.<br>Не работают парктроники и дистроник. Торг.",
"img" => "http://d.photos.kl.kcdn.kz/ef/bf2f4c5b672b76b0d0729e0c64d6ef/1-400x300.jpg"
],
2 => [
"name" => "Porsche Cayenne",
"info" => "Панорамная крыша, алькантара, изменяемый клиренс.<br>аэродинамический обвес Sport Design, PASM (Porsche Active Suspension Management), PDCC (Porsche Dynamic Chassis Control). Porsche Cayenne GTS фирменного для этой модели цвета Carmine Red. Авто в отличном состоянии, обслуживается на официальном сервисе",
"img" => "http://e.photos.kl.kcdn.kz/c2/de3895b8a2808c05c0a68c41a7da58/2-400x300.jpg"
],
3 => [
"name" => "Toyota Land Cruiser",
"info" => "Новый авто 2015 года, без пробега абсолютно! Черный и белый. Максимальная комплектация 7 мест. Гарантия 2 года.",
"img" => "http://d.photos.kl.kcdn.kz/ca/469c35e1e9e5c996f8713e1879336c/1-400x300.jpg"
],
];
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<style>
.block-info {
width: 500px;
border: solid 1px #111;
display: block;
position: relative;
padding-left: 120px;
}
.block-info img {
position: absolute;
left: 10px;
top: 10px;
display: inline;
width: 100px;
}
</style>
<?foreach ($info as $inf) {?>
<div class="block-info">
<img src="<?=$inf['img']?>" alt="<?=$inf['name']?>">
<h3><?=$inf['name']?></h3>
<p><?=$inf['info']?></p>
</div>
<?}?>
</body>
</html>
[/spoiler]