Bootstrap 实际中是怎么使用的?

2015-01-29 11:46:10 +08:00
 zippera
原来做过 一个小网站,学习bs,看自己想要哪种样式,然后html里面直接套id class。

公司做web的时候是怎么用的?比如用rails,怎么使用呢?
3011 次点击
所在节点    前端开发
10 条回复
kmvan
2015-01-29 12:36:26 +08:00
学几次都学不下去,感觉那玩意就根不与艺术设计毫无关系
typcn
2015-01-29 12:37:05 +08:00
@kmvan +1 不是懒得图省事的话自己写 UI
sangsir
2015-01-29 12:40:13 +08:00
其實他的class的意思很多就是縮寫了一些東西的名字,慢慢就記住
比如button = btn
等等……一般設計的時候都是對照中文網有個CSS在線的然後來寫- -用到什麼寫什麼
不過用久了常用的基本就記住了
geeklian
2015-01-29 12:41:21 +08:00
bs就是省事啊,让不是前端,没有艺术细胞的门外汉,也能写出看得过去的界面。
soulteary
2015-01-29 14:14:48 +08:00
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
2015-01-29 14:28:39 +08:00
关于使用,请参考dom结构。以及特定组件差异化使用,诸如定宽容器和浮动容器一起使用etc.
gihnius
2015-01-29 14:29:30 +08:00
省事是省事,但 bs3 的 div/dom 嵌套得太深了。
比如 https://www.padory.com 页面很简单,但有 700-800 个元素.
gihnius
2015-01-29 14:37:20 +08:00
@gihnius 如果不是用 bs3, 可能 200/300 就 ok 了。
skyshy
2015-01-29 20:31:19 +08:00
@soulteary 说得不错,最近在看BS的js模块,也是给了很多启发
soulteary
2015-01-29 23:40:29 +08:00
@gihnius 你需要合理拆分文件,把它的层级划出来||一台支持高分辨率可以竖起来的显示器||智能的现代编辑器= =...

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

这货还有一个好处就是基于一定规范的开发,让协作容易(包括二次开发)。
单独维护的结构和样式,随着时间的推移,会产生一些不必要的冗余(unuse),以及浪费维护者在一致性表现上的时间。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/166438

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX