求制作这个页面的源代码

 

 主要用到div和图片,可以参考下这个代码,更多的可以自己去修改:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
        #main{
            width:250px;
            height:250px;
            border:1px solid silver
        }
        img{
            height:100px;
            width:95%;
            padding:5px;
        }
        p{
            margin-top:0px;
            font-size:12px;
            padding:5px;
        }
        .price{
            color:tomato;
            font-size:16px;
        }
        .yj{
            padding-left:10px;
            font-size:10px;
        }
        .qg{
            border:1px solid silver;
            margin-left:10px;
            height:24px;
            width:60px;
            border-radius: 5px;
            background-color: silver;
            display: inline-block;
            text-align:center;
            line-height: 24px;

        }
    </style>
</head>
<body>
    <div id="main">
        <p>团购网</p>
        <img src="./1.jpeg" alt="" width="">
        <p>【69店通用】过桥米线代金券1张,无需预约,全场通用</p>
        <p><span class="price">¥19.9</span> <span class="yj">原价:¥39 | 6.6折</span><span class="qg">去抢购</span></p>
    </div>
</body>
</html>

 

除了图片部分,其他部分直接用html+css就可以完成。

图片部分根据题目,是带有切换效果的,找一个带切换效果的js就可以,或者直接用 bootstrap自带的也可以,不过需要自行调整样式成为图片的样子

最好还是自己实现的好就是布局这种很锻炼css和html

您好,我是有问必答小助手,您的问题已经有小伙伴解答了,您看下是否解决,可以追评进行沟通哦~

如果有您比较满意的答案 / 帮您提供解决思路的答案,可以点击【采纳】按钮,给回答的小伙伴一些鼓励哦~~

ps:问答VIP仅需29元,即可享受5次/月 有问必答服务,了解详情>>>https://vip.csdn.net/askvip?utm_source=1146287632