在开发中遇到了两个小疑问：
核算相对宽度
阅读器宽度在1230px和560px之间时，咱们开端将文章整体宽度设定在阅读器宽度的80%，文章内容的宽度为该宽度的90%。为了保证紧贴在文章右侧的操作栏不会跟着阅读器宽度改变而变形，咱们给它一个定宽60px，这就有疑问了，文章内容宽度会以文章整体宽度的90%进行改变，可是操作栏宽度并不是10%，因此跟着阅读器宽度减小，文章和操作栏之间就会出现一条越来越窄的缝隙。咱们运用CSS calc()解决的这个疑问，它是用于核算相对长度的CSS函数，只要将文章内容的宽度变成calc(100% - 60px)就能够了(webkit和moz阅读器需要加相应前缀)。而对于不支持calc的阅读器，仍设置其宽度为90%。
在js中运用media query
当页面款式依据media query界说的宽度范围发生改变时，咱们希望js在这个时候能做点事情，可是用js检测到的宽度和media query界说的宽度不匹配，解决方法是运用Modernizr供给的mq函数来匹配CSS中界说的media query，也可能够运用Enquire.js之类的js库。
CSDN记者：在描绘方面，尤其是瀑布流和ui的描绘上，你们有哪些思考，有啥注意事项?
邹颂兵：在描绘上，之所以选用瀑布流的形式，是因为cnBeta内容量非常大，每天更新很频繁，而且文章没有明确的分类，这种聚合式的内容很合适瀑布流排版，这个排版尽可能多的利用不一样分别率展示内容，而且经过无限下拉的滚动加载方法，也极好地让用户便利检查更多文章。
UI方面，咱们一是要与cnBeta本身的品牌风格一致，不能让用户觉得“哇，这仍是CB吗”。另一个即是咱们是从一款Web App的角度去界说这个体验的，那么当在IE10全屏阅读时，界面上的按钮是不是足够满意用户的操作需要、按钮的大小是不是合适触摸等，都是需要思考的疑问。
CSDN记者：该项目中用到了哪些开发工具或框架或开源商品?
邹颂兵：用到的开源js库包含
1). modernizr: 低版本阅读器的功用检测和优雅降级;
2). turn.js: 十大人气文章的翻书作用;
3). jquery masonry + infinitescroll: 完成新闻的瀑布流规划和无限加载功用;
4). jquery nicescroll: 改变阅读器滚动条的款式、滚动速率等;
5). jquery templates: 基于HTML的模板，答应在HTML中界说变量，运用js对象或数组界说的数据给变量赋值后，模板就变成一般的HTML片段，可经过jquery插入到DOM中。咱们依据cnBeta供给的后台接口界说了不一样的模板，运用从服务器取得的数据烘托对应的模板，插入到DOM中;
6). jquery tipsy: 生成类似Facebook 音讯提示框的控件;
7). trunk8: 依据文本框的尺寸裁剪文字，用于新闻摘要;
开源CSS框架：
1). SASS
SASS是CSS3的扩展语言，它不仅拥有CSS3的语法和功用，一起增强了CSS的可编程性。你能够在SASS中界说变量和函数(mixins)，还能够将子元素的款式直接界说在父元素的款式傍边;SASS还答应款式承继，比方你能够在元素A的款式界说中承继B的款式，连同B的一切子元素的款式也都被承继过来。款式界说的规划变得愈加明晰，开发和保护都愈加便利。测验时将SASS文件编译成CSS文件即可。
2). Compass
Compass是基于SASS的开源框架，将常用的SASS功用以函数形式供给调用接口，比方修正float元素的款式疑问，你能够直接在款式中引入”@include clearfix;”,Compass会将这段clearfix函数实时编译成CSS代码;若是想为一个元素参加一像素的圆角，运用“@include border-radius(1px);”，Compass会在border-radius前自动参加各个阅读器的前缀，编译到CSS文件中。不仅如此，Compass还支持插件功用，若是想运用bootstrap，下载对应插件，在SASS文件中”@import”这个插件就能够了。
开发工具
1). Vim: 神器…
2). Diffmerge: 项目的文件兼并
3). IE10的F12开发工具
CSDN记者：您对有方案做跨渠道web app的团队有啥主张?
邹颂兵：咱们以为，跨渠道web app最大的特点——同样也是它最大的优势即是，你很简单就能够将桌面端的事务逻辑应用于移动渠道，从而让你的服务接触到最广阔的受众。因此这里最重要的作业即是怎么对于移动端进行优化：在功用上，是不是要缩减不必要的功用，是不是要对于某个设备参加多点触控功用;你的UI是不是合适触摸等等。在这些疑问都思考明白之后，接下来即是怎么完成跨渠道，咱们采取的方法是呼应式规划，这种方法易于开发、保证各渠道体验的一致性，可是很费流量。还有其他一些完成跨渠道的方法，比方开发一个对于手机端的简易版网站，速度快、节约流量，价值是献身一些界面的美感;同样还有移动端混合形式的web app，你能够运用本地的UI控件，内容来自网站，这种方法极大提升了用户体验，但仍是增加了一些跨渠道开发的成本。你能够看到这些跨渠道的方法各有利弊，因此应当从功用性、呼应率、开发成本以及流量等方面做一个权衡。
无论运用那种方法，将CSS规划好是一项必要的作业。你能够运用SASS 和Compass来规划CSS，比方能够界说一个_base.scss文件来包含一些根本作业：款式重置、设置变量等;为不一样元素的款式界说不一样的SASS文件，便于查找和修改，在编译时再决定兼并哪些文件。
最终是事务逻辑的分层。web app 的规划越明晰、功用之间的耦合性越低，就会使跨渠道的作业变得愈加简单，这是毋庸置疑的。当前，像Backbone.js这样的前端MVC框架遭到广泛重视，咱们也在思考运用Backbone来重构代码，而且咱们相信，跟着web app的功用越来越复杂，MVC将会变成人们架构前端代码的遍及方法。
后话：重视呼应式描绘的公司许多，对它的争辩也没有停下来过。但事实是越来越多的公司开端测验这种描绘形式，新版的cnBeta是一个极好的展示。IE10加紧了对Web标准的拥抱，除了对HTML5新特性的支持，同样，IE10供给了足够丰厚的CSS支持，在许多新的CSS工具中都供给了动画、过渡和变换。IE10还对下一代规划工具供给了实验性支持，例如CSS网格规划、CSS多列规划和CSS区域。开发者们不妨多重视一下。