V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
zippera
V2EX  ›  前端开发

Bootstrap 实际中是怎么使用的?

  •  1
     
  •   zippera ·
    zippera · 2015-01-29 11:46:10 +08:00 · 3123 次点击
    这是一个创建于 3590 天前的主题,其中的信息可能已经有所发展或是发生改变。
    原来做过 一个小网站,学习bs,看自己想要哪种样式,然后html里面直接套id class。

    公司做web的时候是怎么用的?比如用rails,怎么使用呢?
    10 条回复    2015-01-29 23:40:29 +08:00
    kmvan
        1
    kmvan  
       2015-01-29 12:36:26 +08:00 via Android
    学几次都学不下去,感觉那玩意就根不与艺术设计毫无关系
    typcn
        2
    typcn  
       2015-01-29 12:37:05 +08:00
    @kmvan +1 不是懒得图省事的话自己写 UI
    sangsir
        3
    sangsir  
       2015-01-29 12:40:13 +08:00   ❤️ 1
    其實他的class的意思很多就是縮寫了一些東西的名字,慢慢就記住
    比如button = btn
    等等……一般設計的時候都是對照中文網有個CSS在線的然後來寫- -用到什麼寫什麼
    不過用久了常用的基本就記住了
    geeklian
        4
    geeklian  
       2015-01-29 12:41:21 +08:00 via iPhone   ❤️ 1
    bs就是省事啊,让不是前端,没有艺术细胞的门外汉,也能写出看得过去的界面。
    soulteary
        5
    soulteary  
       2015-01-29 14:14:48 +08:00   ❤️ 1
    bootstrap目前是github上关注度最高的项目没有之一,那么它解决了什么问题呢

    1.内置reset,尽可能抹平浏览器显示差异(区别对待v2,v3)
    2.栅格系统(吸取纸媒呈现优势)
    3.响应式设计(小成本提供不同分辨率支持)
    4.丰富的组件样式(表格,表单,列表,轮播,提醒,etc)
    5.快速实现的交互组件(一行属性,不用写代码都能直接使用弹出窗,popover,scrollspy等)
    =>实现原型快(框架通用的好处)

    它缺少什么:

    1.shim
    2.配色规范(支持自定义,但是并没有配色规范)
    3.js代码模块化(因为依赖jq,跟着jq走)
    4.默认组件dom结构固定。
    5.细粒度组件(开源有不少,也可以自己添)
    =>定制相对复杂(框架通用缺点)

    举几个例子:

    个人博客,界面大概用了2天就完成了,包括细节组件。
    soulteary.com

    一个ghost theme,cosplay的付费主题,也是很快完成了。
    huaidan.im

    企业站点的话,新浪云以及一些后台,我记得我用的是v2.2,后来升级了一次。

    国内还有其他的云也使用这个框架做前端HTML框架,企业站和小站就更不计其数了。
    soulteary
        6
    soulteary  
       2015-01-29 14:28:39 +08:00
    关于使用,请参考dom结构。以及特定组件差异化使用,诸如定宽容器和浮动容器一起使用etc.
    gihnius
        7
    gihnius  
       2015-01-29 14:29:30 +08:00
    省事是省事,但 bs3 的 div/dom 嵌套得太深了。
    比如 https://www.padory.com 页面很简单,但有 700-800 个元素.
    gihnius
        8
    gihnius  
       2015-01-29 14:37:20 +08:00
    @gihnius 如果不是用 bs3, 可能 200/300 就 ok 了。
    skyshy
        9
    skyshy  
       2015-01-29 20:31:19 +08:00
    @soulteary 说得不错,最近在看BS的js模块,也是给了很多启发
    soulteary
        10
    soulteary  
       2015-01-29 23:40:29 +08:00
    @gihnius 你需要合理拆分文件,把它的层级划出来||一台支持高分辨率可以竖起来的显示器||智能的现代编辑器= =...

    dom节点数量某种程度反应了页面的内容丰富程度(乱用/滥用的除外),如果节点简单,交互性/功能性/样式修饰可能太过于朴素了。

    这货还有一个好处就是基于一定规范的开发,让协作容易(包括二次开发)。
    单独维护的结构和样式,随着时间的推移,会产生一些不必要的冗余(unuse),以及浪费维护者在一致性表现上的时间。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1016 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 28ms · UTC 21:25 · PVG 05:25 · LAX 13:25 · JFK 16:25
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.