V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
设计师推荐装备
WACOM 数位板
推荐阅读
版式设计基础教程 by 南云治嘉
版式设计全攻略 by 佐佐木刚士
wangyuan
V2EX  ›  设计师

有谁使用过 Twitter Bootstrap? 求交流

  •  
  •   wangyuan · 2012-07-04 14:12:18 +08:00 · 7227 次点击
    这是一个创建于 4556 天前的主题,其中的信息可能已经有所发展或是发生改变。
    我最近看了不少前端开发利器,发现Bootstrap相当唯美。不知道有谁正在使用或将要使用么?大家一块交流一下啊。

    我的问题是:我们的UI设计师并不知道这个库,也不一定熟悉这个风格,所以设计出来的结果可能差异很大。这样我使用这个库(特别是css效果)的总体效果不大。

    另外求推荐其他能提高工作效率各种前端利器。。。。
    35 条回复    1970-01-01 08:00:00 +08:00
    bcxx
        1
    bcxx  
       2012-07-04 14:13:53 +08:00
    fyunli
        2
    fyunli  
       2012-07-04 14:21:45 +08:00   ❤️ 1
    bootstrap是无UI设计师的屌丝公司的福音
    venngomez
        3
    venngomez  
       2012-07-04 14:26:05 +08:00
    使用中,很适合没设计师的穷开发者使用,很容易上手。它的responsive特点是个强项,不过我觉得用了后有时很难精确layout, 所以通常不用,不过别的高手可能有不同的看法。
    chairo
        4
    chairo  
       2012-07-04 14:26:54 +08:00   ❤️ 3
    在用啊
    推荐下: http://bootswatch.com/
    Sivan
        5
    Sivan  
       2012-07-04 14:29:57 +08:00
    这种前端库看看就得,借鉴需要的部分,未必真的要用。Smashing Magazine 有期采访也是说到最好不要用这些库做开发。
    armoni
        6
    armoni  
       2012-07-04 14:32:13 +08:00
    用框架就得忍受他的框框
    chshouyu
        7
    chshouyu  
       2012-07-04 14:37:28 +08:00
    这个还是适合没有前端基础的程序员使用,比如做后台的
    NemoAlex
        8
    NemoAlex  
       2012-07-04 14:58:03 +08:00   ❤️ 1
    适合偷懒的人快速搭建一些小项目
    lanyueniao
        9
    lanyueniao  
       2012-07-04 14:59:27 +08:00
    flask-admin.
    chloerei
        10
    chloerei  
       2012-07-04 15:00:42 +08:00
    bootstrap 是给无设计师的团队/个人快速搭建网站用的。真的认真做一个服务应该从头开始不要用 ui 框架。不过设计师应该看看 bootstrap 的源码学习它的模块化。
    wangyuan
        11
    wangyuan  
    OP
       2012-07-04 15:18:39 +08:00   ❤️ 1
    @bcxx @fyunli @venngomez @chairo @Sivan @armonl @chshouyu @NemoAlex @lanyuenlao @chloere 谢谢各位啊!非常同意你们的看法。。我们现在有UI设计师。。纠结中。。。。
    neildd
        12
    neildd  
       2012-07-04 15:26:00 +08:00
    不好用!!用了bootstarp再加上自己写的css会干扰会乱。
    于是我干脆自己写了全部css,也没那么烦。
    wangyuan
        13
    wangyuan  
    OP
       2012-07-04 15:29:10 +08:00
    @neildd 是的,所以纠结啊。。。不过作为一个后台开发人员,我是真心喜欢它的样式,包括bootswatch里面的各种主题。。。
    bcxx
        14
    bcxx  
       2012-07-04 15:29:52 +08:00
    @wangyuan http://twitter.github.com/bootstrap/less.html 看这里自己 built 一下就好了
    venngomez
        15
    venngomez  
       2012-07-04 15:31:58 +08:00
    @wangyuan 即使有UI设计师,我觉得bootstrap还是个很好的选择,我也曾开发过一个较大型的网站,css自己开发,现在看看bootstrap,觉得采用bootstrap效果会更好,现在正在逐步采用中。
    wangyuan
        16
    wangyuan  
    OP
       2012-07-04 15:32:31 +08:00
    @bcxx 了解,现在犹豫的是要不要采用这个框架,特别是我们设计师设计的界面和bootstrap的差异蛮大的。
    bcxx
        17
    bcxx  
       2012-07-04 15:35:19 +08:00
    那用 h5bp 吧
    wangyuan
        18
    wangyuan  
    OP
       2012-07-04 15:37:34 +08:00
    @venngomez 老实说,另外一个问题是我觉得我们现在的设计效果没bootstrap好。。。纠结。。。
    wangyuan
        19
    wangyuan  
    OP
       2012-07-04 15:46:45 +08:00
    @bcxx 学习中。。。但这个网站本身的设计让哥眼睛很痛,特别是那个粗体字。。。
    AlloVince
        20
    AlloVince  
       2012-07-04 16:02:06 +08:00
    会LESS才能玩的转,可以像我这样把Twitter Bootstrap拆散了,自己复写一些模块,最后根据项目按需加载
    https://github.com/AlloVince/eva-engine/tree/master/public/static/eva/css
    hetaoblog
        21
    hetaoblog  
       2012-07-04 16:14:18 +08:00
    我在学习使用中,但是之前有个误区以为用了这神器就解决了前端问题,其实不是的,
    而且bootstrap的一些风格在ie和ff/chrome下显示差异非常大,略有点郁闷
    linlis
        22
    linlis  
       2012-07-04 16:17:13 +08:00
    @wangyuan bootstrap 很好,你们设计师设计的 UI 和 boostrap 差别很大这不是问题,在 bootstrap 的基础之上进行调整就是了。

    bootstrap 的优点在于:

    1. twitter 出品,并且开源,经得起考验,极大减少了测试的工作量
    2. 组件丰富,极大提高了工作效率
    3. 常用 mixin 也基本帮你整理好了
    4. responsive
    venngomez
        23
    venngomez  
       2012-07-04 16:19:15 +08:00
    @wangyuan 有那信心,不要犹豫,就用自己的,混用不是好的选择。
    adow
        24
    adow  
       2012-07-04 16:27:56 +08:00
    同意 @fyunli ,没有ui就用这个做好了
    wangyuan
        25
    wangyuan  
    OP
       2012-07-04 18:47:05 +08:00
    @linlis @AlloVince @adow @venngomez 谢谢各位。。。。让哥再体验体验。。。后台做前端,哥痛苦啊
    kedron
        26
    kedron  
       2012-07-04 20:38:08 +08:00
    AlloVince
        27
    AlloVince  
       2012-07-04 20:43:09 +08:00   ❤️ 2
    @kedron 用在中文网站替换中文字体是必须的,Helvetica在Firefox下中文笔画粗细都不一样。

    我的实例,基本看不出用过bootstrap吧 http://shishijia.com/
    j
        28
    j  
       2012-07-04 22:47:25 +08:00
    初级入门不需要less,css代码可以覆盖的。
    然而你这个情况重点在于设计师是否能接受这么先进的工作模式。
    如果不能,那还是lz自己动手吧。对了先fire了你们的设计师,可以节省很多工资。
    armoni
        29
    armoni  
       2012-07-04 23:32:18 +08:00
    @AlloVince 真心佩服
    huacnlee
        30
    huacnlee  
       2012-07-05 09:00:52 +08:00
    挺好用的, Bootstrap 是前端框架,别把它理解成模板了,它给你提供了一套完善的前端规范

    http://720p.so 这个也是 Bootstrap 的,你能看出来吗?
    blankyao
        31
    blankyao  
       2012-07-05 09:04:55 +08:00
    @huacnlee 还真没看出来...
    wangyuan
        32
    wangyuan  
    OP
       2012-07-05 18:22:25 +08:00
    @kedron @AlloVince @J @armonl @huacnlee @blankyao 谢谢各位分享得实例,看来我过于担心了。。。。
    Sivan
        33
    Sivan  
       2012-07-05 19:16:43 +08:00   ❤️ 1
    @AlloVince 效果很好,可是光 CSS 文件就 131K 啊,这也是我认为 CSS 框架的弊端之一。

    在复写过大部分样式后,冗余的样式代码非常多。所以我觉得仅提炼 CSS 框架中需要的那部分加入到项目中就好。

    Bootstrap 曾经想用过,但我跟 LZ 相反,我不想用其中 UI 的部分,里面的样式代码污染太严重,最后放弃了……轻量框架我觉得 H5BP 比较好。
    eric_q
        34
    eric_q  
       2012-07-05 21:01:22 +08:00
    上面的几个例子很不错~确实看不出bootstrap了
    AlloVince
        35
    AlloVince  
       2012-07-05 21:16:56 +08:00
    @Sivan 其实这已经是精简过的了,只加载了我需要的模块。

    你提到的“污染”问题我也注意到了,其实解决也很简单,参看我在最上面的回复里的项目,可以给所有可能的侵入性强的模块都重新添加命名空间,包括
    type.less
    tables.less
    forms.less
    code.less

    Reset也可以选用更适合自己的,其实最终修改量很小
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1021 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 24ms · UTC 20:43 · PVG 04:43 · LAX 12:43 · JFK 15:43
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.