【CSS】Intermediate8:Page Layout
1.Layout with CSS is easy. You just take a chunk of your page and shove it wherever you choose
2.position property
3.static value
renders a box in the normal order of things
4.relative
much like static but the box can be offset from its original position
top/right/bottom/left properties
5.absolute
pulls a box out of normal flow of HTML & delivers it to a world all of its own
t/r/b/l
6.fixed
like absolute but reference to the browser window as opposed to the web page
Fixed boxes should stay exactly where they are on the screen even when the page is scrolled
How stupidly easy!
7.float
Shift the box to the right or left of a line,with surrounding content flowing around it
l/r value
8.clear
do not want the next box to wrap around the floating objects
l/r/both value
Footer!Hoorah!
【CSS】Intermediate8:Page Layout的更多相关文章
- 【css】清除浮动的几种方式
[css]清除浮动的几种方式 因为浮动框不在普通的文档流中,所以它不占据空间.如下面的代码: .news { background-color:gray; border:1px solid bla ...
- 【BZOJ1731】[Usaco2005 dec]Layout 排队布局 差分约束
[BZOJ1731][Usaco2005 dec]Layout 排队布局 Description Like everyone else, cows like to stand close to the ...
- 【CSS】隐藏多行文本框Textarea在IE中的垂直滚动栏
在<[CSS]禁止Google浏览器同意定义调整多行文本框>(点击打开链接)中已经提及过怎样使多行文本框Textarea在一些DOM2的浏览器中固定下来. 这不,多行文本框Textarea ...
- 【css】用css巧妙实现移动端横向滑动展示功能
前言:记得以前处理移动端横向滑动展示都是去用js去解决的,要用js进行蛮多处理,要算li的宽度,然后还要用js设置ul盒子的宽度,又要设置最大滑动距离,最小滑动距离等等.......但是现在发现用cs ...
- 【CSS】思考和再学习——关于CSS中浮动和定位对元素宽度/外边距/其他元素所占空间的影响
一.width:auto和width:100%的区别 1.width:100%的作用是占满它的参考元素的宽度.(一般情况下参考元素 == 父级元素,这里写成参考元素而不是父级元素,在下面我会再 ...
- 【CSS】css动画及过渡和变换属性
1.css动画 创建一个动画: @keyframes name{ //动画名字 0% { //动画开始 transform: translateY(0); } 100% { //动画结束 transf ...
- 【CSS】元素样式
1.使用CSS的三种方式: 方式一.通过元素的style属性来设置元素的样式 方式二.在HTML头部标签<head>中通过<link>标签引入一个外部的CSS资源,通常是一个C ...
- 【CSS】iconfont的使用
说到浏览器对@font-face的兼容问题,这里涉及到一个字体format的问题,因为不同的浏览器对字体格式支持是不一致的,这样大家有必要了解一下,各种版本的浏览器支持什么样的字体,前面也简单带到了有 ...
- 【CSS】318- CSS实现宽高等比自适应容器
点击上方"前端自习课"关注,学习起来~ 在最近开发移动端页面,遇到这么一个情况:当页面宽度 100% 时,高度为宽度一半,并随手机宽度变化依然是一半. 于是我们就需要实现一个宽度自 ...
随机推荐
- php中的修饰符
上面使用了一个修饰符U,详见关于修饰符的介绍. PHP正则表达式修饰符的理解: 在PHP正则表达式里面的修饰符可以改变正则的很多特性,使得正则表达式更加适合你的需要(注意:修饰符对于大小写是敏感的,这 ...
- 走进WCF一 (异常如此多娇,引无数码农竞折煞)
对于WCF一直都是只知其然,公司框架的架构者也只是对我们授之以鱼,而不授之以渔. 带着初学者的态度进入了大神Artech的博客,逐步慢慢上手. 我的解决方案(和大神的一模一样,只是过程中一波三折的) ...
- jenkins 重新设置 管理员密码
由于服务器瘫痪,修好之后经常不上,就把jenkins的管理密码忘掉了. 查阅了网上所有方案之后发现没有一个 能正确修改密码的,特此列出下列网上的方法 第一.设成无需密码验证的(网上有教程,不过并不能修 ...
- 基于C#的SolidWorks插件开发(1)--SolidWorks API接口介绍
这是两年前毕业时写的一篇关于SolidWorks插件开发与公司PDM集成的毕业设计,最近闲来无事拿出来整理一下,大神们可以略过. 1.1 SolidWorks API接口 正确调用SolidWor ...
- hdu 2844 poj 1742 Coins
hdu 2844 poj 1742 Coins 题目相同,但是时限不同,原本上面的多重背包我初始化为0,f[0] = 1;用位或进行优化,f[i]=1表示可以兑成i,0表示不能. 在poj上运行时间正 ...
- cocos2d-js Mac下的JSB绑定步骤
cocos2d-js由于采用js语言,使得做一些native的功能比较受限,例如文件和目录操作.socket操作等.逼不得已,这时我们就不得不做jsbinding了.. 官方提供的jsbinding方 ...
- Nhibernate配置和访问数据问题
今天开始用Nhibernate做为自己的ORM,但是做的过程中确实遇到了好多问题,现在将问题收集起来以防日后出现相同的问题, 总结下: 这就是我的整个项目,现在配置下hibernate.cfg.xml ...
- android apk 反编译
Apk文件结构 apk文件实际是一个zip压缩包,可以通过解压缩工具解开.以下是我们用zip解开helloworld.apk文件后看到的内容.可以看到其结构跟新建立的工程结构有些类似. java代码: ...
- 解释型语言和编译型语言的不同以及Python如何运行
计划写关于Python中如何实现属性管理.函数(或类方法)管理.类管理的几篇成系列的文章. 而这篇文章写在这个系列之前,希望对后面几篇文章的理解有所帮助. 老实说,我也是在网上搜索了一些资料才写的这篇 ...
- hdu 3715
一个很简单的2-sat的题: 不过比较难想到: 其实也不是很难,可能接触的少了吧! #include<cstdio> #include<vector> #define maxn ...