css流式和弹性布局(未完)
(子容器%父容器)*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流式和弹性布局(未完)的更多相关文章
- ch8 固定宽度、流式、弹性布局
假设浏览器窗口设置为1250px:wrapper的宽度为960px:content的宽度为920px:确保了wrapper居中时两边有20px的间距: secondary的宽度为230px: pr ...
- css流式布局
elem{ width:1160px;/*流式布局的总宽度*/ column-width:375px; -moz-column-width: 375px; /*每列宽度*/ -webkit-colum ...
- parquet列式文件实战(未完,待续)
parquet列式文件实战 parquet code demo http://www.programcreek.com/java-api-examples/index.php?source_dir=h ...
- 16.libgdx根据配置文件生成布局(未完)
思路: screen分为普通和复杂两种,普通的功能大部分是页面跳转以及简单的crud数据,复杂的单独弄出来 跳转普通的screen,直接根据配置文件调整设置 <layouts> <l ...
- 流式处理框架storm浅析(上篇)
本文来自网易云社区 作者:汪建伟 前言 前一段时间参与哨兵流式监控功能设计,调研了两个可以做流式计算的框架:storm和spark streaming,我负责storm的调研工作.断断续续花了一周的时 ...
- CSS3与页面布局学习笔记(四)——页面布局大全(负边距、双飞翼、多栏、弹性、流式、瀑布流、响应式布局)
一.负边距与浮动布局 1.1.负边距 所谓的负边距就是margin取负值的情况,如margin:-100px,margin:-100%.当一个元素与另一个元素margin取负值时将拉近距离.常见的功能 ...
- 静态布局、自适应布局、流式布局、响应式布局、弹性布局简析、BFC
静态布局:给页面元素设置固定的宽度和高度,单位用px,当窗口缩小,会出现滚动条,拉动滚动条显示被遮挡内容.针对不同分辨率的手机端,分别写不同的样式文件.例如:浏览器窗口是1000px,那么最小的宽度是 ...
- 浅谈静态布局、流式布局,rem布局,弹性布局、响应式布局
静态布局: 特点:没有兼容性问题 PC:居中布局,所有样式使用绝对宽度/高度(px),设计一个Layout,在屏幕宽高有调整时,使用横向和竖向的滚动条来查阅被遮掩部分:移动设备:另外建立移动网站,单独 ...
- webapp,liveapp: 流式布局和rem布局
liveapp场景应用,一般针对的是移动端,近来也是很火,颇有一些感受,拿来分享一下. 页面宽度范围: 一般移动端页面我们的像素范围是320px-640px,最大640px,最小320px,所以设计稿 ...
随机推荐
- new Option()——实现时间联动
//1.动态创建select function createSelect(){ var mySelect = document.createElement("select"); m ...
- JAVA关键词synchronized的作用
记下来,很重要. Java语言的关键字,当它用来修饰一个方法或者一个代码块的时候,能够保证在同一时刻最多只有一个线程执行该段代码. 一.当两个并发线程访问同一个对象object中的这个synchron ...
- Ext江湖笔记:JavaScript基本知识点
1.基本对象:Number,String,Date,Array,Error,RegExp,Math,Boolean ps:本人基本使用java写代码,常常写出Number n = new Number ...
- ORACLE调度之基于时间的调度(一)【weber出品】
一.调度的概述 这里我看到一篇对调度的概述觉得描述的比我好,但仅限于概述部分,其他部分我觉得我讲的比他好,于是发生以下事情: ************************华丽的转载******** ...
- clang: error: unable to execute command: Segmentation fault: 11
我在Archive的时候出现了上面这个错误, 解决方法很简单: After huge trying I have disabled the Bitcode in Project's Target-&g ...
- JavaScript 客户端JavaScript之事件(DOM API 提供模块之一)
具有交互性的JavaScript程序使用的是事件驱动的程序设计模型. 目前使用的有3种完全不同的不兼容的事件处理模型. 1.原始事件模型 (一种简单的事件处理模式) 一般把它看作0级DOM API ...
- UVA 305 Joseph (约瑟夫环 打表)
Joseph The Joseph's problem is notoriously known. For those who are not familiar with the original ...
- IIS 中asp.net的一些配置
安装了IIS之后, 添加了虚拟目录然后运行页面, 出现了一点儿错误, 好像是不认识aspx文件, 把aspx文件当成是xml文件处理. 无法显示 XML 页. 使用 XSL 样式表无法查看 XML 输 ...
- ecos之widget
weekbuy:widget.php<?php $setting['author']='zhang'; $setting['name']='周末购'; $setting['version']=' ...
- phpEXCEL操作全解
phpExcel中文帮助手册,列举了各种属性,以及常用的操作方法,难得是每一个都用实例加以说明,希望对大家有所帮助. phpExcel中文帮助手册,不可多得的好文章,供大家学习参考. 1.设置exce ...