二小1号
2018-03-01 03:23
采纳率: 50%
浏览 4.8k

webstorm打开的html页面与本地打开的同一个html样式显示不一样

同样的一个页面,使用webstorm自带的服务器打开,和在本地打开后显示的样式不一样
不知道是什么原因,请大神指点。

原代码:

 <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        * {
            padding: 0;
            margin: 0;
        }
        .father {
            width: 1000px;
            height: 560px;
            margin: 0 auto;
            background: url(images/ui.png) no-repeat top center;
            position: relative;
        }
        .son {
            width: 150px;
            height: 30px;
            background: pink;
            position: absolute;
            bottom: 10px;
            left: 50%;/*1000*50%*/
            margin-left: -75px;
            /*right: 75px;*/
        }
    </style>
</head>
<body>
    <div class="father">
        <div class="son"></div>
    </div>
</body>
</html>

图片说明

图片说明

图片说明

图片说明

同样的html文件,打开后的样子就是不一样,大小不一样。

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

6条回答 默认 最新

  • 牛坛子 2018-03-01 03:25
    已采纳

    你的比例不一样,你将webstom比例调试成chrom一样的宽度比例就是一样的了。

    点赞 打赏 评论
  • 别来无恙`` 2018-03-01 03:28

    在.father中加个backgroung-size:100%

    点赞 打赏 评论
  • 别来无恙`` 2018-03-01 03:31

    应该是浏览器的问题,你按住Ctrl然后滚动鼠标滚轮把两个页面都弄成100%就可以了

    点赞 打赏 评论
  • 周慧雨 2018-03-01 03:33

    你好 我的感觉是 可能你引用的文件的某些路径在本地打开的时候没有加载 你如果用chrome的开 develop tool看一下是不是有什么文件无法access

    点赞 打赏 评论
  • qq_27026807 2018-03-01 04:19

    这个只要在.father中加个backgroung-size:100%
    就可以了。。。。

    点赞 打赏 评论
  • qq_37995557 2018-03-13 02:19

    你的浏览器是不是缩放了!或者你把最外层的标签设置为backgroung-size:100%试试

    点赞 打赏 评论

相关推荐 更多相似问题