php储存网页内容的简单示范

html 样式：

* {
            margin: 0;
            padding: 0;
            list-style: none;
        }
        
        a {
            text-decoration: none;
        }
        
        .fl {
            float: left;
        }
        
        .fl{
            float: right;
        }
        
        body {
            background: black;
        }
        
        .cll {
            width: 1264px;
            margin: 0 auto;
            background: white;
            padding-top: 34px;
        }
        .clls{
            width: 1236px;
            margin-left: 28px;
            padding-bottom: 336px;
        }
        .clls .tob {
            width: 100%;
            height: 40px;
            overflow: hidden;
            background: #777;
            margin-bottom: 25px;
        }
        .clls .tob p{
            float:left;
            line-height: 40px;
            margin-left:15px;
        }
        .clls .tob ul{
            float:left;
            overflow:hidden;
        }
        .clls .tob ul li{
            float:left;
            width:56px;
            height:24px;
            border:1px solid #777;
            background:#F1F1F1;
            color:#42B9F0;
            line-height: 24px;
            text-align: center;
            margin-top:7px;
            margin-right: 8px;
            font-weight: 100;
            font-size: 14px;
        }
        .maine{
            overflow:hidden;
            
        }
        .mains{
                width: 228px;
                height: 393px;
                border: 1px solid #fffefe;
                background: #E3E3E3;
                margin-right: 8px;
                margin-bottom: 16px;
        }
        .mains .wer{
            width:100%;
            height:348px;
            background:white;
        }
        .mains .wer>p{
            color:cornflowerblue;
            font-size:12px;
            line-height:16px;
            margin-left:7px;
        }
        .mains .wer .jia{
            overflow:hidden;
            margin-top:6px;
        }
        .mains .wer .jia p{
            float:left;
            color:#FF4200;
            margin-left:5px;
        }
        .mains .wer .jia span{
            float: left;
            display: block;
            text-decoration: line-through;
            font-size: 13px;
            margin-top: 2px;
            color: #777;
            margin-left: 60px;
            
        }
        .mains .wer .ping{
            overflow: hidden;
            width: 212px;
            margin: 0 auto;
            border-top: 1px solid #d4d1d1;
            margin-top: 12px;
        }
        .mains .wer .ping .ping-1,.mains .wer .ping .ping-2{
            width:70px;
            height:52px;
            border-right:1px solid #d4d1d1;
        }
        .mains .wer .ping .ping-3{
            width:70px;
            height:52px;
            
        }
        .mains .wer .ping .ping-1 p{
            font-size:12px;
            color:cornflowerblue;
            text-align: center;
            margin-top:5px;
        }
        .mains .wer .ping .ping-1 span{
            display: block;
            font-size:12px;
            color:#d4d1d1;
            text-align: center;
            margin-top:5px;
        }
        .mains .wer .ping .ping-2 p{
            font-size:12px;
            color:#B57C5B;
            text-align: center;
            margin-top:5px;
        }
        .mains .wer img{
            width:220px;
            height:220px;
        }
        .mains .wer .ping .ping-2 span{
            display: block;
            font-size:12px;
            color:#d4d1d1;
            text-align: center;
            margin-top:5px;
        }
        .mains .wer .ping .ping-3 p{
            font-size:12px;
            color:#B57C5B;
            text-align: center;
            margin-top:5px;
        }
        .mains .wer .ping .ping-3 span{
            display: block;
            font-size:12px;
            color:#d4d1d1;
            text-align: center;
            margin-top:5px;
        }

PHP数组:

 $a=[
     0=>[
     'name'=>'美国空运车厘子 新鲜水果进口大樱桃 2<br/>斤装',
     'print'=>'168',
     'Original price'=>'208',
     'image'=>'./234/images/1.jpg',
     'Sales volume'=>'168',
     'Clicks'=>'0'
 ],
     1=>[
     'name'=>'佳沛新西兰阳光奇异果12个 进口猕猴<br/>桃 新鲜水果',
     'print'=>'88',
     'Original price'=>'108',
     'image'=>'./234/images/2.jpg',
     'Sales volume'=>'88',
     'Clicks'=>'0'
 ],
     2=>[
     'name'=>'佳沛新西兰绿奇异果36个(原装)进口猕<br/>猴桃 新鲜水果',
     'print'=>'148',
     'Original price'=>'160',
     'image'=>'./234/images/3.jpg',
     'Sales volume'=>'148',
     'Clicks'=>'0'
 ],
     3=>[
     'name'=>'七果果 越南白心火龙果[三斤起拍，只多<br/>不少]进口新鲜水果 堪比红心火龙果',
     'print'=>'30',
     'Original price'=>'50',
     'image'=>'./234/images/4.jpg',
     'Sales volume'=>'30',
     'Clicks'=>'0'
 ],
     4=>[
     'name'=>'哥伦比亚金燕窝果 新鲜进口水果 麒麟果<br/>黄色白心火龙果 4只',
     'print'=>'468',
     'Original price'=>'499',
     'image'=>'./234/images/5.jpg',
     'Sales volume'=>'468',
     'Clicks'=>'0'
 ],
     5=>[
     'name'=>'诚绿丰 越南进口红肉火龙果 新鲜水果红<br/>心火龙果 江浙沪皖包邮 1斤装',
     'print'=>'49',
     'Original price'=>'69',
     'image'=>'./234/images/6.jpg',
     'Sales volume'=>'49',
     'Clicks'=>'0'
 ],
     6=>[
     'name'=>'加拿大樱桃 2斤装 车厘子 樱桃 进口新<br/>鲜水果',
     'print'=>'128',
     'Original price'=>'149',
     'image'=>'./234/images/7.jpg',
     'Sales volume'=>'128',
     'Clicks'=>'0'
 ],
     7=>[
     'name'=>'畅享礼盒 奇异果火龙果佳节送礼进口新<br/>鲜水果',
     'print'=>'168',
     'Original price'=>'198',
     'image'=>'./234/images/8.jpg',
     'Sales volume'=>'168',
     'Clicks'=>'0'
 ],
     8=>[
     'name'=>'越南红心火龙果5斤装 红肉火龙果 新鲜<br/>进口水果',
     'print'=>'666',
     'Original price'=>'7654',
     'image'=>'./234/images/09.jpg',
     'Sales volume'=>'666',
     'Clicks'=>'0'
 ],
     9=>[
     'name'=>'新西兰红玫瑰苹果queen4个（约180g/<br/>个）',
     'print'=>'121',
     'Original price'=>'312',
     'image'=>'./234/images/010.jpg',
     'Sales volume'=>'121',
     'Clicks'=>'0'
 ],
 ];

html代码：

 <div class="cll">
        <div class="clls">
            <div class="tob"> 
            <p>排序 ：</p>
            <ul>
                <li>价格</li>
                <li>销量</li>
                <li>人气</li>
            </ul>
        
        </div>
        <div class="maine">
            <?php foreach($a as $value):?>
            <div class="mains fl">
           
               <div class="wer">
                    <a href="#"><img src="<?php echo $value["image"]; ?>" alt=""></a>
                    <p><?php echo $value["name"]; ?></p>
                    <div class="jia">
                        <p><?php echo $value["print"]; ?></p>
                        <span><?php echo $value["Original price"]; ?></span>
                    </div>
                    <div class="ping">
                        <div class="ping-1 fl">
                            <p><?php echo $value["Sales volume"]; ?></p>
                            <span>商品销量</span>
                        </div>
                        <div class="ping-2 fl">
                            <p>评论表</p>
                            <span>用户评论</span>
                        </div>
                        <div class="ping-3 fl">
                            <p><?php echo $value["Clicks"]; ?></p>
                            <span>点击量</span>
                        </div>
                    </div>
                </div>
            </div>
           <?php endforeach;?>
       </div>

显示页面如下