(子容器%父容器)*100

png透明
ie6中
filter:progid:DXImageTransfornm.Microsoft.AlphaImageLoader(

src='路径',sizingMethod='crop');
)
behavior:url(iepngfix.htc)
让一个div水平、垂直居中

一、流式布局两个要点:
1,在link中加入media
<link src="global.css" />
<link src="ipad.css " media="(max-width:980px) and (min-width:600px)" />
<link src="mobile.css " media="(max-width:599px)" />

2,把精确的像素改为百分比,并使用box-sizing:border-box。
盒模型以border为准。
解决流式布局中两个水平盒子各分50%的宽度

二、在页面布局中小的点
在上面要点基础上也有一些小的点用来精细的设置页面

甚至padding也可以使用百分比。

border-radius

-webkit-linear-graient();

用js检测用户使用设备

使用device.js检测浏览器

device.ipad()
device.mobile()
device.iphone()
device.android()
device.tablet()
device.portait()
device.landscape()

http://qianduanblog.com/post/css-learning-16-css3-flex-responsive-design.html
http://qianduanblog.com/post/css-learning-18-css3-flex-responsive-design-example.html

http://www.kancloud.cn/zhongzhong/webtop/106237
http://www.kancloud.cn/zhongzhong/webtop/106238
http://www.ithao123.cn/content-1752271.html

css流式和弹性布局(未完)的更多相关文章

  1. ch8 固定宽度、流式、弹性布局

    假设浏览器窗口设置为1250px:wrapper的宽度为960px:content的宽度为920px:确保了wrapper居中时两边有20px的间距:  secondary的宽度为230px:  pr ...

  2. css流式布局

    elem{ width:1160px;/*流式布局的总宽度*/ column-width:375px; -moz-column-width: 375px; /*每列宽度*/ -webkit-colum ...

  3. parquet列式文件实战(未完,待续)

    parquet列式文件实战 parquet code demo http://www.programcreek.com/java-api-examples/index.php?source_dir=h ...

  4. 16.libgdx根据配置文件生成布局(未完)

    思路: screen分为普通和复杂两种,普通的功能大部分是页面跳转以及简单的crud数据,复杂的单独弄出来 跳转普通的screen,直接根据配置文件调整设置 <layouts> <l ...

  5. 流式处理框架storm浅析(上篇)

    本文来自网易云社区 作者:汪建伟 前言 前一段时间参与哨兵流式监控功能设计,调研了两个可以做流式计算的框架:storm和spark streaming,我负责storm的调研工作.断断续续花了一周的时 ...

  6. CSS3与页面布局学习笔记(四)——页面布局大全(负边距、双飞翼、多栏、弹性、流式、瀑布流、响应式布局)

    一.负边距与浮动布局 1.1.负边距 所谓的负边距就是margin取负值的情况,如margin:-100px,margin:-100%.当一个元素与另一个元素margin取负值时将拉近距离.常见的功能 ...

  7. 静态布局、自适应布局、流式布局、响应式布局、弹性布局简析、BFC

    静态布局:给页面元素设置固定的宽度和高度,单位用px,当窗口缩小,会出现滚动条,拉动滚动条显示被遮挡内容.针对不同分辨率的手机端,分别写不同的样式文件.例如:浏览器窗口是1000px,那么最小的宽度是 ...

  8. 浅谈静态布局、流式布局,rem布局,弹性布局、响应式布局

    静态布局: 特点:没有兼容性问题 PC:居中布局,所有样式使用绝对宽度/高度(px),设计一个Layout,在屏幕宽高有调整时,使用横向和竖向的滚动条来查阅被遮掩部分:移动设备:另外建立移动网站,单独 ...

  9. webapp,liveapp: 流式布局和rem布局

    liveapp场景应用,一般针对的是移动端,近来也是很火,颇有一些感受,拿来分享一下. 页面宽度范围: 一般移动端页面我们的像素范围是320px-640px,最大640px,最小320px,所以设计稿 ...

随机推荐

  1. new Option()——实现时间联动

    //1.动态创建select function createSelect(){ var mySelect = document.createElement("select"); m ...

  2. JAVA关键词synchronized的作用

    记下来,很重要. Java语言的关键字,当它用来修饰一个方法或者一个代码块的时候,能够保证在同一时刻最多只有一个线程执行该段代码. 一.当两个并发线程访问同一个对象object中的这个synchron ...

  3. Ext江湖笔记:JavaScript基本知识点

    1.基本对象:Number,String,Date,Array,Error,RegExp,Math,Boolean ps:本人基本使用java写代码,常常写出Number n = new Number ...

  4. ORACLE调度之基于时间的调度(一)【weber出品】

    一.调度的概述 这里我看到一篇对调度的概述觉得描述的比我好,但仅限于概述部分,其他部分我觉得我讲的比他好,于是发生以下事情: ************************华丽的转载******** ...

  5. clang: error: unable to execute command: Segmentation fault: 11

    我在Archive的时候出现了上面这个错误, 解决方法很简单: After huge trying I have disabled the Bitcode in Project's Target-&g ...

  6. JavaScript 客户端JavaScript之事件(DOM API 提供模块之一)

    具有交互性的JavaScript程序使用的是事件驱动的程序设计模型.   目前使用的有3种完全不同的不兼容的事件处理模型. 1.原始事件模型 (一种简单的事件处理模式) 一般把它看作0级DOM API ...

  7. UVA 305 Joseph (约瑟夫环 打表)

     Joseph  The Joseph's problem is notoriously known. For those who are not familiar with the original ...

  8. IIS 中asp.net的一些配置

    安装了IIS之后, 添加了虚拟目录然后运行页面, 出现了一点儿错误, 好像是不认识aspx文件, 把aspx文件当成是xml文件处理. 无法显示 XML 页. 使用 XSL 样式表无法查看 XML 输 ...

  9. ecos之widget

    weekbuy:widget.php<?php $setting['author']='zhang'; $setting['name']='周末购'; $setting['version']=' ...

  10. phpEXCEL操作全解

    phpExcel中文帮助手册,列举了各种属性,以及常用的操作方法,难得是每一个都用实例加以说明,希望对大家有所帮助. phpExcel中文帮助手册,不可多得的好文章,供大家学习参考. 1.设置exce ...