OurJS


OurJS-我们的JS, 我们的技术-IT文摘; 专注JS相关领域;
我们热爱编程, 我们热爱技术;我们是高大上, 有品味的码农;

欢迎您订阅我们的技术周刊


我们会向您分享我们精心收集整理的,最新的行业资讯,技术动态,外文翻译,热点文章;
我们使用第三方邮件列表向您推送,我们不保存您的任何个人资料,注重您的隐私,您可以随时退订,

欢迎分享您的观点,经验,技巧,心得

让我们一起找寻程序员的快乐,探索技术, 发现IT人生的乐趣;


本网站使用缓存技术每次加载仅需很小流量, 可在手机中流畅浏览;
如果您发现任何BUG,请即时告知我们: ourjs(at)ourjs.com

自己动手写CSS流式(响应式)布局


分享到
分类 技术前沿   关键字 前端   发布 ourjs  1408003035180
注意 转载须保留原文链接,译文链接,作者译者等信息。  

在CSS中,你可以使用一个小标记来表示分栏的样式,并且自适应页面的大小。CSS的分栏是一个有趣的选项,简单的几行CSS代码即可创建响应式且向后兼容的流式布局。目前已经支持IE10+, Firefox, Chrome等主流浏览器,以下是几行代码,即可将一段文字分成两栏。 (PS: 当页面总宽度放不下两栏时,则会自动分为一栏,  如Chrome中 width < 400px)


  article{
    -webkit-columns: 2 200px;
       -moz-columns: 2 200px;
            columns: 2 200px;
  }  
原文地址: 点此
社区评论 ( Beta版 )
  • #0 赵羽止 1444377883064

    显示对方答复

  • #1 923971370 1457964139019

    【怎么学习网页制作】 现在很多小伙伴喜欢在互联网上找视频资料学习网页制作,但是光看视频你是不可能学会网页制作的,没有人指导你,而且很多视频已经过时了 并没有什么用! 如果你真的想学习网页制作这门技术,你可以来这个群【494064934】 在这里有最新的HTML课程 免费学习 不需要你付出什么 只要你有一颗学习的心就可以了

OnceDoc 您自己的企业内容管理系统——文档、流程、知识库、报表、网盘All In One

访问404页面,寻找丢失儿童
 关键字 - 前端
  1. 15个最好的HTML5前端响应式框架(2014)
  2. 5个经典的前端面试问题
  3. 用css禁用input、checkbox、select等html控件,实现disable效果
  4. 用纯css改变下拉列表select框的默认样式
  5. 我们抛弃了AngularJS:单页面应用的5大缺陷
  6. 超简易——Bootstrap可关闭tab标签页
  7. Animate.css让添加CSS动画像喝水一样容易
  8. 用纯CSS停止冒泡和阻止浏览器默认行为及事件响应,达到禁用(disable)的目的
  9. 我为什么选择 D3.js
  10. CSS3实现的响应式字体:自适应视图窗口大小的新单位

 欢迎订阅 - 技术周刊

我们热爱编程, 我们热爱技术; 我们是高端, 大气, 上档次, 有品味, 时刻需要和国际接轨的码农; 欢迎您订阅我们的技术周刊; 您只需要在右上角输入您的邮箱即可; 我们注重您的隐私,您可以随时退订.
加入我们吧! 让我们一起找寻码农的快乐,探索技术, 发现IT人生的乐趣;


 关注我们

我们的微信公众号: ourjs-com
打开微信扫一扫即可关注我们:
IT文摘-程序员(码农)技术周刊

ourjs官方微信号