制作华西医院（http://www.wchscu.cn/index.html）如下图局部

【问题描述】
制作华西医院（http://www.wchscu.cn/index.html%EF%BC%89%E5%A6%82%E4%B8%8B%E5%9B%BE%E5%B1%80%E9%83%A8%E3%80%82
要求：
1、使用 Grid 布局
2、尺寸、颜色、背景、字体、字体大小等与原网页一致
3、以“S1431070138.html”命名网页
4、把做的网页与原网页比对并截图

img

<!doctype html>
<meta charset="utf-8" />
<style>
    body {
        background: url(http://www.wchscu.cn/Uploads/Picture/2022/10/21/s6351f295a7357.jpg) no-repeat;
        background-size: cover;
    }

    .container {
        color:#fff;
        background: rgba(0,0,0,0.45);
        max-width: 420px;
        margin: 0 auto;
        display: flex;
        flex-direction: column;
        padding-bottom:20px
    }

     .container img {max-width: 100%}
.container .guide {margin-top: 30px;display:flex;justify-content:center}
.container .guide .item {background-color: #6e1d2a;border-radius:8px;width:calc((100% - 70px)/2);height:120px;display:flex;align-items:center;justify-content:center}
    .container .guide .item .word{margin-left:15px}
    .container .contact{padding:20px 30px;font-size:14px}
    .container .contact .item{line-height:30px;display:flex;background-position:left 8px;background-repeat:no-repeat;padding-left:25px}
 .container .contact .item img{vertical-align:middle;display:inline-block;margin-right:5px;width:20px}
.container .contact .item span{margin-right:5px}
</style>
<div class="container">
    <img src="http://www.wchscu.cn/Uploads/Picture/2022/10/20/s6350fdbeed664.png" />
    <div class="guide">
        <div class="item">
            <img src="http://www.wchscu.cn/Public/static/themes_yq/image/wmy/icon1.png" />
            <div class="word">预<br />约<br />挂<br />号</div>
        </div>
        <div class="item" style="margin-left:10px">
            <img src="http://www.wchscu.cn/Public/static/themes_yq/image/wmy/icon2.png" />
            <div class="word">院<br />内<br />导<br />航</div>
        </div>
    </div>
    <div class="contact">
        <div class="item" style="background-image:url(http://www.wchscu.cn/Public/static/themes_yq/image/wmy/icon4.png)">
            <span>电话:</span>
            028-85422114
        </div>
        <div class="item" style="background-image:url(http://www.wchscu.cn/Public/static/themes_yq/image/wmy/icon5.png)">
            <span>传真:</span>
            028-85582944
        </div>
        <div class="item" style="background-image:url(http://www.wchscu.cn/Public/static/themes_yq/image/wmy/icon6.png)">
            <span>地址:</span>
            <div>
                四川省成都市武侯区国学巷37号（院本部）<br />
                温江区芙蓉大道三段363号（温江院区）<br />
                锦江区成龙路和锦江大道交汇处（锦江院区）
            </div>
        </div>
        <div class="item" style="background-image:url(http://www.wchscu.cn/Public/static/themes_yq/image/wmy/icon7.png);background-position-y:5px">
            <span>网站备案号:</span>
            蜀ICP备16010396号-5-1
        </div>
    </div>
</div>

三个div,一个ul,li.flex布局

您好，我是有问必答小助手，您的问题已经有小伙伴帮您解答，感谢您对有问必答的支持与关注！
PS：问答VIP年卡 【限时加赠：IT技术图书免费领】，了解详情>>> https://vip.csdn.net/askvip?utm_source=1146287632