V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
mr_pppoe
V2EX  ›  程序员

三个关于CSS的问题

  •  
  •   mr_pppoe ·
    pppoe · 2012-05-26 12:48:43 +08:00 · 3792 次点击
    这是一个创建于 4564 天前的主题,其中的信息可能已经有所发展或是发生改变。
    请教做Web开发的同学几个问题。不知道这个该发设计还是程序...

    1.在css的body下写了width:1280px,系统下看到Resolution:1280x800,但是仍然出现了水平滚动条, 而且还可以水平滚动,为什么?

    2.对于width, height, padding, margin, font-size这种属性是不是统一都用px作单位?还是说用比例%比较好?

    3.有时候感觉两个element间距太宽,可以通过把padding, margin设成负数来调整,这是不是不好的代码?

    谢啦 :]
    15 条回复    1970-01-01 08:00:00 +08:00
    icyflash
        1
    icyflash  
       2012-05-26 12:55:49 +08:00   ❤️ 1
    1.浏览器垂直滚动条,边框,margin都有可能导致这个问题

    2.除非是Fluid布局,不然最好还是使用px或em

    3.既然允许有负值,就是为了让布局更灵活
    raly
        2
    raly  
       2012-05-26 12:58:19 +08:00   ❤️ 1
    第 1 条还有可能是左右 padding 造成的。
    deepure
        3
    deepure  
       2012-05-26 13:07:27 +08:00   ❤️ 1
    关于负值,看怎么应用,搜索负值之美
    YuHong
        4
    YuHong  
       2012-05-26 13:09:31 +08:00   ❤️ 1
    1、你的屏幕宽度1280 但纵向滚动条占掉一些宽度
    2、%宽度自适应,px精准。这个根据你布局需求选择。字体可以用em
    3、非必要时尽量少用
    lianghai
        5
    lianghai  
       2012-05-26 13:17:06 +08:00   ❤️ 1
    对于第一点,最好学会用浏览器的 inspector……
    qiuai
        6
    qiuai  
       2012-05-26 20:06:38 +08:00   ❤️ 1
    1.你需要做一下clear.可以用*{padding:0;margin:0;}
    2.用%的好处是可以自适应.
    3.用负值没什么好奇怪的.但是兼容性需要考虑到.
    loading
        7
    loading  
       2012-05-26 20:45:02 +08:00   ❤️ 1
    1. 浏览器在1280分辨率时,页面宽度会受到垂直滚动条的影响。1024时代,安全页面宽度是1001,是考虑了当时所有浏览器滚动条宽度的。
    2. 这个要看是你是否使用弹性布局
    对于字体大小,我想提醒个著名的.625
    下面的这个很详细
    http://stackoverflow.com/questions/3879365/how-to-easily-change-a-font-sizing-from-px-to-em-for-a-big-existing-site

    3. 两个元素距离太宽?ie6会有双重margin问题(?),注意好兼容问题,ie的盒子模型也是不同的,可以搜索下"hasLayout"
    Sivan
        8
    Sivan  
       2012-05-26 20:55:29 +08:00   ❤️ 1
    1. 有些浏览器不管页面多高,本身都有滚动条,占据 20px 左右宽度。所以你想应对 1280 的分辨率,那么页面应该低于 1260px 比较安全。

    2. 一般情况可以都用 px,在很长的一段时间里网页单位也基本以 px 为主。现在流行做响应性所以 width、margin 等属性流行用 %。font-size 用 em 也很好,以后用 % 和 em 的地方会非常多。

    3. padding 没有负值。margin 用负值完全没有问题,但是要注意兼容问题。但是使用 margin 会影响文档流的其他元素,不想影响其他元素又要移位可以使用 position:relative; 然后使用 top、left 等属性,可以用负值。
    mr_pppoe
        9
    mr_pppoe  
    OP
       2012-05-26 20:59:57 +08:00
    @lianghai 对啊..这个好
    @qiuai clear了之后就好了,谢了
    dianso
        10
    dianso  
       2012-05-26 21:06:25 +08:00   ❤️ 1
    现在还是流行960px吧,太宽了不好
    mr_pppoe
        11
    mr_pppoe  
    OP
       2012-05-26 21:51:13 +08:00
    @dianso @Sivan 谢了,看起来还是把页面做小一点比较好了。嗯,position:relative这种应该是比较好的做法了
    qiuai
        12
    qiuai  
       2012-05-27 12:40:02 +08:00
    @mr_pppoe 嗯...很多浏览器都会给默认的padding和margin.这个其实用firebug一看就知道了.
    piderManX
        13
    piderManX  
       2012-05-27 12:52:59 +08:00
    @loading 同意
    benzhe
        14
    benzhe  
       2012-05-27 13:20:18 +08:00
    1. 一般浏览器都有自己的边框,而且垂直滚动条也占了位置,body 默认有 margin ,所以能显示的宽度肯定没 1280px 了,一般页面宽度设为 960px,同时适应 1024*768;
    2. 单位的选取一般按照项目的需求以适应不同的呈现方式,不过一般情况用 px 最省事。
    3. padding 标准没有负值。由于布局的逻辑和代码可读,一般负值能不用则不用。

    提交这段文字的时候居然 502 了....
    iEggache
        15
    iEggache  
       2012-05-27 15:08:00 +08:00
    1.我看到很多页面的CSS设计会将用到的标签的margin,padding等先清零
    2.px还百分比还是其他这得根据情境,一般都没啥问题,看具体用到的地方
    3.可以用啊
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1098 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 24ms · UTC 18:59 · PVG 02:59 · LAX 10:59 · JFK 13:59
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.