携程首页--使用flex布局实现】的更多相关文章

携程首页 flex解决了float和postion的遗留问题,对移动端比较友好. 需要水平排列的元素就为其父元素设置display:flex,并为子元素添加flex的值(比例) 布局时可以先从大的页面着手,搭建出基本的框架 .banner>.nav+.extra+.footer 比如:.nav下面是有很多item,根据观察分为左边部分和右边部分,因此nav就是flex布局;sub和pub的比例就是1:2.. 值得注意的地方就是sub下面的a是使用float进行布局的,因此是两种布局方式结合使用.…
今天写了一个携程界面的UI,利用H5的弹性盒子来实现,学过H5弹性盒子的,来看是比较方便的,因为CSS代码都差不多. 可以看看这篇博客 快速使用CSS 弹性盒子 效果图如下: 主要是携程首页的四个模块: 代码: <view class="page"> <view class="page__bd"> <view class="section__nav"> <view class="left bor…
实现如下图所示的一个页面布局 布局框架 思路讲解: 1.一开始的思路是使用android提供的画布将布局中的内容花下来,之后想了想觉得比较麻烦,所以又开启了另外一条思路. 2.如上图“布局框架”所示.最外部是一个大布局(RelativeLayout),里面包含了两个控件(一个标题,和一个LinearLayout(包含了内容)的控件).布局做好之后,下面就是计算高度的问题了.假设标题高度为40dp,则内容外层的布局只需要向上填充19像素,标题的高度的一半就能够和内容外层布局的边框居中对齐.然后再给…
就在今天,2015年5月28日,中国最大的旅游机票预订网站--携程网粗大事了.据传携程网的数据库被人物理删除了,而容灾备份的数据又无法正常使用,服务器全面遭受瘫痪.每小时给携程带来的损失约100万美元.巴拉巴拉,作为中国最大的.Net互联网公司,携程出了这样的事情真是不应该(技术人员:怪我咯). 转入正题当我们打开携程首页会看到这样一个错误页面: 在页面的下方我们会看到404这样一串数字. 其实在我们打开一些小网站时,常常会遇到这样一串数字,这些数字是我们进行http请求时,服务端给出的响应结果…
效果图如下: <body> <div class="nav"> <div class="row"> <div class="col1"> <a href="#"> <em>酒店</em> <i></i> </a> </div> <div class="col2">…
携程Android App的插件化和动态加载框架已上线半年,经历了初期的探索和持续的打磨优化,新框架和工程配置经受住了生产实践的考验.本文将详细介绍Android平台插件式开发和动态加载技术的原理和实现细节,回顾携程Android App的架构演化过程,期望我们的经验能帮助到更多的Android工程师. 需求驱动 2014年,随着业务发展需要和携程无线部门的拆分,各业务产品模块归属到各业务BU,原有携程无线App开发团队被分为基础框架.酒店.机票.火车票等多个开发团队,从此携程App的开发和发布…
编者:本文来自携程框架研发部高级经理魏晓军在第二期[携程技术微分享]上的分享,以下为整理后的文字实录.视频回放可点击这里.关注携程技术中心微信公号ctriptech,可获知更多微分享课程信息. 因为支持用javascript开发原生应用,React Native一推出就受到不少公司热捧,各家都跃跃欲试.但有一个痛点是,在移动端,我们是否有必要开发多套程序:iOS.Android和H5?本次将通过对Moles框架的分享,介绍携程在React Native方面的实战干货,希望给大家一些灵感和启发.…
我所了解的 IBM.京东.携程.eBay 的 OpenStack 云 参加过几次 OpenStack meetup 活动,听过这几家公司的Architect 讲他们公司的 OpenStack产品.本文试着凭借影响加网络搜索,按照自己的理解,对这些公司的 OpenStack 产品和使用做个大概的比较.一家之言而已. 1.IBM 的 OpenStack 云 IBM 现在把 Cloud 做为公司几大战略之一,其中 IAAS 是 OpenStack + Soft Layer,所以 OpenStack 处…
因为支持用javascript开发原生应用,React Native一推出就受到不少公司热捧,各家都跃跃欲试.但有一个痛点是,在移动端,我们是否有必要开发多套程序:iOS.Android和H5?本次将通过对Moles框架的分享,介绍携程在React Native方面的实战干货,希望给大家一些灵感和启发. 本次分享的内容包括三个方面: Moles框架在React Native和我们主App的集成中起到了什么作用? Moles框架是如何打通Android.iOS.H5.SEO,让我们一套代码跑在多个…
携程Android App的插件化和动态加载框架已上线半年,经历了初期的探索和持续的打磨优化,新框架和工程配置经受住了生产实践的考验.本文将详细介绍Android平台插件式开发和动态加载技术的原理和实现细节,回顾携程Android App的架构演化过程,期望我们的经验能帮助到更多的Android工程师. 需求驱动 2014年,随着业务发展需要和携程无线部门的拆分,各业务产品模块归属到各业务BU,原有携程无线App开发团队被分为基础框架.酒店.机票.火车票等多个开发团队,从此携程App的开发和发布…