Enviar búsqueda
Cargar
Alice库构建
•
9 recomendaciones
•
1,866 vistas
Sofish Lin
Seguir
在淘宝的分享
Leer menos
Leer más
Tecnología
Denunciar
Compartir
Denunciar
Compartir
1 de 51
Descargar ahora
Descargar para leer sin conexión
Recomendados
支付宝CSS构架
支付宝CSS构架
Sofish Lin
中文網路字型的現況與挑戰(Webconf 20130113)
中文網路字型的現況與挑戰(Webconf 20130113)
michael 葉
現代化網頁基礎排版技術
現代化網頁基礎排版技術
洧杰 廖
Reviews of Designing with Web Standards
Reviews of Designing with Web Standards
avenirzheng
漫談 CSS 架構方法 - 以 OOCSS, SMACSS, BEM 為例
漫談 CSS 架構方法 - 以 OOCSS, SMACSS, BEM 為例
Kuro Hsu
如何逐步提升CSS的可利用性、模組化
如何逐步提升CSS的可利用性、模組化
洧杰 廖
Style基础优化之独角兽篇
Style基础优化之独角兽篇
fangdeng
快速入坑 Node.js - 0613 SITCON 雲林定期聚
快速入坑 Node.js - 0613 SITCON 雲林定期聚
Lorex L. Yang
Recomendados
支付宝CSS构架
支付宝CSS构架
Sofish Lin
中文網路字型的現況與挑戰(Webconf 20130113)
中文網路字型的現況與挑戰(Webconf 20130113)
michael 葉
現代化網頁基礎排版技術
現代化網頁基礎排版技術
洧杰 廖
Reviews of Designing with Web Standards
Reviews of Designing with Web Standards
avenirzheng
漫談 CSS 架構方法 - 以 OOCSS, SMACSS, BEM 為例
漫談 CSS 架構方法 - 以 OOCSS, SMACSS, BEM 為例
Kuro Hsu
如何逐步提升CSS的可利用性、模組化
如何逐步提升CSS的可利用性、模組化
洧杰 廖
Style基础优化之独角兽篇
Style基础优化之独角兽篇
fangdeng
快速入坑 Node.js - 0613 SITCON 雲林定期聚
快速入坑 Node.js - 0613 SITCON 雲林定期聚
Lorex L. Yang
KISSY Mechanism
KISSY Mechanism
lifesinger
鳳山高中/網頁應用程式開發入門 I
鳳山高中/網頁應用程式開發入門 I
Lorex L. Yang
Qq.com前端架构实践与思考
Qq.com前端架构实践与思考
greengnn
MySQL设计、优化、运维
MySQL设计、优化、运维
Jinrong Ye
Intro-to-SeaJS
Intro-to-SeaJS
lifesinger
浅析浏览器解析和渲染
浅析浏览器解析和渲染
Ailsa126
史上最经典的Word press 主题教程
史上最经典的Word press 主题教程
chenronglin
北護大/FHIR 開發簡介與應用
北護大/FHIR 開發簡介與應用
Lorex L. Yang
Exam 98-375 HTML5 Application Development Fundamentals
Exam 98-375 HTML5 Application Development Fundamentals
Chieh Lin
Style基础优化之独角兽篇
Style基础优化之独角兽篇
fangdeng
Word press theme主题制作教程
Word press theme主题制作教程
pangyuxing
2011新版首页总结 技术篇
2011新版首页总结 技术篇
传贵 谢
MySQL运维那些事
MySQL运维那些事
Jinrong Ye
Html&css培训 舒克
Html&css培训 舒克
jay li
MySQL数据库设计、优化
MySQL数据库设计、优化
Jinrong Ye
CSS preprocessor 介紹,與 SASS 入門分享
CSS preprocessor 介紹,與 SASS 入門分享
wantingj
数据库与ssd的实践与探索-2011数据库技术大会
数据库与ssd的实践与探索-2011数据库技术大会
freezr
[2008]网站重构 -who am i
[2008]网站重构 -who am i
Twinsen Liang
CSS 101
CSS 101
Sofish Lin
关于 Html5 那点事
关于 Html5 那点事
Sofish Lin
实时/可接入的 Web 技术
实时/可接入的 Web 技术
Sofish Lin
新 · 交互
新 · 交互
Sofish Lin
Más contenido relacionado
La actualidad más candente
KISSY Mechanism
KISSY Mechanism
lifesinger
鳳山高中/網頁應用程式開發入門 I
鳳山高中/網頁應用程式開發入門 I
Lorex L. Yang
Qq.com前端架构实践与思考
Qq.com前端架构实践与思考
greengnn
MySQL设计、优化、运维
MySQL设计、优化、运维
Jinrong Ye
Intro-to-SeaJS
Intro-to-SeaJS
lifesinger
浅析浏览器解析和渲染
浅析浏览器解析和渲染
Ailsa126
史上最经典的Word press 主题教程
史上最经典的Word press 主题教程
chenronglin
北護大/FHIR 開發簡介與應用
北護大/FHIR 開發簡介與應用
Lorex L. Yang
Exam 98-375 HTML5 Application Development Fundamentals
Exam 98-375 HTML5 Application Development Fundamentals
Chieh Lin
Style基础优化之独角兽篇
Style基础优化之独角兽篇
fangdeng
Word press theme主题制作教程
Word press theme主题制作教程
pangyuxing
2011新版首页总结 技术篇
2011新版首页总结 技术篇
传贵 谢
MySQL运维那些事
MySQL运维那些事
Jinrong Ye
Html&css培训 舒克
Html&css培训 舒克
jay li
MySQL数据库设计、优化
MySQL数据库设计、优化
Jinrong Ye
CSS preprocessor 介紹,與 SASS 入門分享
CSS preprocessor 介紹,與 SASS 入門分享
wantingj
数据库与ssd的实践与探索-2011数据库技术大会
数据库与ssd的实践与探索-2011数据库技术大会
freezr
[2008]网站重构 -who am i
[2008]网站重构 -who am i
Twinsen Liang
La actualidad más candente
(18)
KISSY Mechanism
KISSY Mechanism
鳳山高中/網頁應用程式開發入門 I
鳳山高中/網頁應用程式開發入門 I
Qq.com前端架构实践与思考
Qq.com前端架构实践与思考
MySQL设计、优化、运维
MySQL设计、优化、运维
Intro-to-SeaJS
Intro-to-SeaJS
浅析浏览器解析和渲染
浅析浏览器解析和渲染
史上最经典的Word press 主题教程
史上最经典的Word press 主题教程
北護大/FHIR 開發簡介與應用
北護大/FHIR 開發簡介與應用
Exam 98-375 HTML5 Application Development Fundamentals
Exam 98-375 HTML5 Application Development Fundamentals
Style基础优化之独角兽篇
Style基础优化之独角兽篇
Word press theme主题制作教程
Word press theme主题制作教程
2011新版首页总结 技术篇
2011新版首页总结 技术篇
MySQL运维那些事
MySQL运维那些事
Html&css培训 舒克
Html&css培训 舒克
MySQL数据库设计、优化
MySQL数据库设计、优化
CSS preprocessor 介紹,與 SASS 入門分享
CSS preprocessor 介紹,與 SASS 入門分享
数据库与ssd的实践与探索-2011数据库技术大会
数据库与ssd的实践与探索-2011数据库技术大会
[2008]网站重构 -who am i
[2008]网站重构 -who am i
Destacado
CSS 101
CSS 101
Sofish Lin
关于 Html5 那点事
关于 Html5 那点事
Sofish Lin
实时/可接入的 Web 技术
实时/可接入的 Web 技术
Sofish Lin
新 · 交互
新 · 交互
Sofish Lin
Html5的应用与推行
Html5的应用与推行
Sofish Lin
分享我的骗骗他
分享我的骗骗他
Sofish Lin
Destacado
(6)
CSS 101
CSS 101
关于 Html5 那点事
关于 Html5 那点事
实时/可接入的 Web 技术
实时/可接入的 Web 技术
新 · 交互
新 · 交互
Html5的应用与推行
Html5的应用与推行
分享我的骗骗他
分享我的骗骗他
Similar a Alice库构建
Css schema by_sofish
Css schema by_sofish
Webrebuild
Modern Web with CSS and CSS Grid (image with links inside)
Modern Web with CSS and CSS Grid (image with links inside)
百範 陳
[圣思园][Java SE]Websphere.application.developer(wsad)使用外置win cvs解决方案
[圣思园][Java SE]Websphere.application.developer(wsad)使用外置win cvs解决方案
ArBing Xie
教網部落格模版設計
教網部落格模版設計
rainlan
css框架研究
css框架研究
chandleryu
SASS入門實作
SASS入門實作
Kingsley Zheng
調配網站的明星花露水
調配網站的明星花露水
Anna Su
20130823微軟雲端平台開發者日
20130823微軟雲端平台開發者日
twMVC
淘宝网前端开发面试题
淘宝网前端开发面试题
Lumend
Semantic ui教學
Semantic ui教學
Tien-Yang (Aiden) Wu
ASP.Net MVC2 简介
ASP.Net MVC2 简介
Allen Lsy
腾讯大讲堂18 让我们戴上有色眼镜--qzone前台架构的优化分享
腾讯大讲堂18 让我们戴上有色眼镜--qzone前台架构的优化分享
areyouok
不一樣的Web server... coServ
不一樣的Web server... coServ
Ben Lue
高效率的、可维护的Css
高效率的、可维护的Css
simaopig
[译]Efficient, maintainable CSS
[译]Efficient, maintainable CSS
jeannewoo
MySQL快速入门与提高
MySQL快速入门与提高
mysqlpub
模块加载策略 - 2012 SDCC, 北京
模块加载策略 - 2012 SDCC, 北京
Joseph Chiang
2314 365737
2314 365737
open
2016年逢甲大學資訊系:ASP.NET MVC 4 教育訓練3
2016年逢甲大學資訊系:ASP.NET MVC 4 教育訓練3
Duran Hsieh
浏览器加载原理
浏览器加载原理
imkingbird
Similar a Alice库构建
(20)
Css schema by_sofish
Css schema by_sofish
Modern Web with CSS and CSS Grid (image with links inside)
Modern Web with CSS and CSS Grid (image with links inside)
[圣思园][Java SE]Websphere.application.developer(wsad)使用外置win cvs解决方案
[圣思园][Java SE]Websphere.application.developer(wsad)使用外置win cvs解决方案
教網部落格模版設計
教網部落格模版設計
css框架研究
css框架研究
SASS入門實作
SASS入門實作
調配網站的明星花露水
調配網站的明星花露水
20130823微軟雲端平台開發者日
20130823微軟雲端平台開發者日
淘宝网前端开发面试题
淘宝网前端开发面试题
Semantic ui教學
Semantic ui教學
ASP.Net MVC2 简介
ASP.Net MVC2 简介
腾讯大讲堂18 让我们戴上有色眼镜--qzone前台架构的优化分享
腾讯大讲堂18 让我们戴上有色眼镜--qzone前台架构的优化分享
不一樣的Web server... coServ
不一樣的Web server... coServ
高效率的、可维护的Css
高效率的、可维护的Css
[译]Efficient, maintainable CSS
[译]Efficient, maintainable CSS
MySQL快速入门与提高
MySQL快速入门与提高
模块加载策略 - 2012 SDCC, 北京
模块加载策略 - 2012 SDCC, 北京
2314 365737
2314 365737
2016年逢甲大學資訊系:ASP.NET MVC 4 教育訓練3
2016年逢甲大學資訊系:ASP.NET MVC 4 教育訓練3
浏览器加载原理
浏览器加载原理
Alice库构建
1.
Alice 为构建更好的支付宝而作
v3 颗粒化 标准 注重协作 兼容 轻量级 快速构建
2.
Alice 为构建更好的支付宝而作
v3 颗粒化 标准 注重协作 兼容 轻量级 快速构建 小鱼,支付宝前端开发攻城师 微博 @sofish | HTTP://sofish.de
3.
SUMMARY 内容概要 1 从一个CSS文件开始
为什么会有现在这种模式? 2 构建 Alice 样式库的基础 如何去构建这样一个库,如何做才是最适合我们的? 3 未来与设想 Alice 小组的计划进一步工作
4.
从一个 CSS 文件开始 优化⼀一下这个CSS文件吧
pa.css
5.
从一个 CSS 文件开始 优化⼀一下这个CSS文件吧
pa.css
6.
从一个 CSS 文件开始
优化⼀一下这个CSS文件吧 1. 压缩版本:94k 2. 1200+ 行(6000+) 3. 全局设置没有限制,文档不齐全 4. 所有系统样式都放在同一个文件中 pa.css
7.
从一个 CSS 文件开始
优化⼀一下这个CSS文件吧 1. 压缩版本:94k 2. 1200+ 行(6000+) 3. 全局设置没有限制,文档不齐全 4. 所有系统样式都放在同一个文件中 无从下手 pa.css
8.
从一个 CSS 文件开始 这个无从下手的东东
9.
从一个 CSS 文件开始 这个无从下手的东东
文件太大,我只有几个页面, 不需要 100k / 6000+ 行的代码
10.
从一个 CSS 文件开始 这个无从下手的东东
文件太大,我只有几个页面, 不需要 100k / 6000+ 行的代码 改版了,我要用什么? 组件大 多是个人版的,还要不要用
11.
从一个 CSS 文件开始 这个无从下手的东东
文件太大,我只有几个页面, 不需要 100k / 6000+ 行的代码 改版了,我要用什么? 组件大 多是个人版的,还要不要用 太多全局设置了,改了怕影 响其他设系,不敢改啊
12.
从一个 CSS 文件开始 这个无从下手的东东
文件太大,我只有几个页面, 不需要 100k / 6000+ 行的代码 改版了,我要用什么? 组件大 多是个人版的,还要不要用 太多全局设置了,改了怕影 响其他设系,不敢改啊 新手,不知道从哪里去入手
13.
从一个 CSS 文件开始 这个无从下手的东东
文件太大,我只有几个页面, 不需要 100k / 6000+ 行的代码 改版了,我要用什么? 组件大 多是个人版的,还要不要用 太多全局设置了,改了怕影 响其他设系,不敢改啊 新手,不知道从哪里去入手 ...
14.
从一个 CSS 文件开始 设计模式
15.
从一个 CSS 文件开始 设计模式
16.
从一个 CSS 文件开始 设计模式
17.
从一个 CSS 文件开始 设计模式
new
18.
从一个 CSS 文件开始 设计模式
new
19.
从一个 CSS 文件开始 base.css •
CSS reset 包括 HTML5 标签的 reset • 小功能: .fn-‐clear 清除浮动 .fn-‐hide/.fn-‐show 相当于display:block;/display:none; .fn-‐left/.fn-‐right 相当于 float:left;/float:right;
20.
从一个 CSS 文件开始 TPL
结构模板 <h3 id="link-0">⼀一般列表(.ui-list)</h3> <ul class="ui-list"> <li class="ui-list-item"><a href="#">新闻第⼀一条</a></li> <li class="ui-list-item"><a href="#">新闻第⼀一条b</a></li> <li class="ui-list-item"><a href="#">新闻第⼀一条c</a></li> </ul> /* * @name: 导航 * @overview: ⼀一般导航 * @require: null */ .ui-nav{} .ui-nav-item{} .ui-nav-item-current{} .ui-nav-item-child{} .ui-nav-item-active-child{}
21.
从一个 CSS 文件开始 Solutions
22.
从一个 CSS 文件开始
解决问题 1. 减少依赖,仅存 base.css 2. 减肥:把 solution 分出来,使用 TPL 3. 颗粒化,只依赖 base.css,并分离各系统的依赖
23.
从一个 CSS 文件开始
解决问题 1. 减少依赖,仅存 base.css 2. 减肥:把 solution 分出来,使用 TPL 3. 颗粒化,只依赖 base.css,并分离各系统的依赖
24.
从一个 CSS 文件开始
解决问题 1. 减少依赖,仅存 base.css 2. 减肥:把 solution 分出来,使用 TPL 3. 颗粒化,只依赖 base.css,并分离各系统的依赖 /* * @name: ui-‐组件名 * @overview: 组件描述 * @required: 与其他组件的依赖关系,⼀一般为null */
25.
从一个 CSS 文件开始 解决问题
26.
从一个 CSS 文件开始
解决问题 只有 base.css, 只有 solution 和 TPL, 没有实际的东西
27.
从一个 CSS 文件开始
解决问题 坑爹 只有 base.css, 只有 solution 和 TPL, 没有实际的东西
28.
从一个 CSS 文件开始 解决问题
29.
从一个 CSS 文件开始 解决问题
30.
从一个 CSS 文件开始 解决问题
31.
从一个 CSS 文件开始 解决问题
只有 base.css, 只有 solution 和 TPL, 大家的编码风格 还是一样。
32.
从一个 CSS 文件开始 解决问题
坑爹 只有 base.css, 只有 solution 和 TPL, 大家的编码风格 还是一样。
33.
从一个 CSS 文件开始 Alice
v3 与样式库
34.
从一个 CSS 文件开始 Alice
v3 与样式库
35.
从一个 CSS 文件开始 Alice
v3 与样式库
36.
从一个 CSS 文件开始 Alice
v3 与样式库
37.
从一个 CSS 文件开始 Alice
v3 与样式库
38.
构建 Alice 样式库的基础 Alice
v3 规范
39.
构建 Alice 样式库的基础 Alice
v3 规范 1. 设计模式 2. 文档结构/命名/注释 3. 组件库构建规范 4. Maven 自动部署与展示平台 5. 其他
40.
构建 Alice 样式库的基础 Alice
v3 规范 1. 设计模式 2. 文档结构/命名/注释 3. 组件库构建规范 4. Maven 自动部署与展示平台 5. 其他 申请访问权限: https://docs.google.com/Doc? docid=0AWiI12yCmwaoZGNiemJqOGpfMThjan M5NWJjaA&hl=en_US
41.
构建 Alice 样式库的基础 组件编写:命名/模块化规范
42.
构建 Alice 样式库的基础
组件编写:命名/模块化规范 1
43.
构建 Alice 样式库的基础
组件编写:命名/模块化规范 2 1 2
44.
构建 Alice 样式库的基础
组件编写:命名/模块化规范 2 1 3 3 2
45.
构建 Alice 样式库的基础 组件编写:命名/模块化规范
46.
构建 Alice 样式库的基础 组件编写:命名/模块化规范
47.
构建 Alice 样式库的基础 组件编写:命名/模块化规范
48.
Alice 小组的计划进一步工作 未来的工作 CSS3 方面的应用和影响交互/视觉的实践研究
未来 规范自动化检测工具 让更多人能用 开源与自动化的结合,让运营能自 己添加页面 增加库的应用,如强化搜索 和代码实时修改 ...
49.
Alice 小组的计划进一步工作 未来的工作 CSS3 方面的应用和影响交互/视觉的实践研究
未来 规范自动化检测工具 让更多人能用 开源与自动化的结合,让运营能自 己添加页面 增加库的应用,如强化搜索 和代码实时修改 ... HTML4和5的应用
50.
51.
thx Thank You !!
& FAQ keynote by sofish http://sofish.de
Descargar ahora