第一个h5页面

最新推荐文章于 2024-04-17 09:42:58 发布

weixin_44519342

最新推荐文章于 2024-04-17 09:42:58 发布

阅读量71

点赞数

分类专栏：后端高级文章标签：后端

原文链接：http://www.mark-to-win.com/tutorial/51907.html

版权

后端高级专栏收录该内容

2 篇文章 0 订阅

订阅专栏

不废话，先爆照，不好勿喷

我用的软件是WebStorm开发，然后也知道了h5我们可以用谷歌浏览器点击右键，然后点击审查，就可以按照手机屏幕来看到页面

下面是项目的图片

这个是我的index.html文件

<!doctype html>
    <html class="no-js" lang="">
        <head>
            <meta charset="utf-8">
            <meta http-equiv="x-ua-compatible" content="ie=edge">
            <title></title>
            <meta name="description" content="">
            <meta name="viewport" content="width=device-width, initial-scale=1">
     
            <link rel="apple-touch-icon" href="apple-touch-icon.png">
            <!-- Place favicon.ico in the root directory -->
     
            <link rel="stylesheet" href="css/normalize.css">
            <link rel="stylesheet" href="css/main.css">
            <script src="js/vendor/modernizr-2.8.3.min.js"></script>
        </head>
        <body>
            <!--[if lt IE 8]>
                <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
            <![endif]-->
     
            <!-- Add your site or application content here -->
     
            <div class="main">
                <div class="head">
                    <span class="head_content" >
                        welcome
                    </span>
                </div>
                <div class="center">
                    <div class="one"><div class="in"><img src="../src/img/santa2.png" class="image"></div><div class="value">圣诞老人</div></div>
                    <div class="one"><div class="in"><img src="../src/img/snowflake.png" class="image"></div><div class="value">雪花</div></div>
                    <div class="one"><div class="in"><img src="../src/img/snowman.png" class="image"></div><div class="value">雪人</div></div>
                    <div class="one"><div class="in"><img src="../src/img/stocking.png" class="image"></div><div class="value">袜子</div></div>
                </div>
                <div class="relax"></div>
                <div class="item"><div ><img src="../src/img/horn2.png" class="image1"><span class="val">活动公告:</span><span class="val1">宝马520li现在只需要50万了</span></div></div>
                <div class="relax"></div>
                <div class="item">
                    <div class="tuijian">精品推荐</div>
                    <div class="rightimg"><img src="../src/img/right65.png" class="image1" class="image1"></div>
                    <div class="gengduo">更多</div>
                </div>
                <div class="relax"></div>
                <div class="item">
                    <div class="tuijian">新品热卖</div>
                    <div class="rightimg"><img src="../src/img/right65.png" class="image1" class="image1"></div>
                    <div class="gengduo">更多</div>