【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% 时,高度为宽度一半,并随手机宽度变化依然是一半. 于是我们就需要实现一个宽度自 ...
随机推荐
- webApi实现增删改查操作
1.WebApi是什么 ASP.NET Web API 是一种框架,用于轻松构建可以由多种客户端(包括浏览器和移动设备)访问的 HTTP 服务.ASP.NET Web API 是一种用于在 .NET ...
- python初准备:安装easy_install和pip
安装easy_install wget http://peak.telecommunity.com/dist/ez_setup.py python ez_setup.py 安装pip wget htt ...
- IOS中如何判断APP是否安装后首次运行或升级后首次运行
对于是否为首次安装的App可以使用如下方法来判断 [[NSUserDefaults standardUserDefaults] boolForKey:@"firstLaunch"] ...
- 转载:PCB名詞解釋:通孔、盲孔、埋孔
在[電子製造業]打滾多年,分享 SMT.焊錫.塑膠射出.產品設計.瓦楞包裝…等經驗.請注意文章內容不見得都正確,服用前請三思… 之前有網友提醒我有篇文章把PCB的盲孔(Blind hole).埋孔(B ...
- 创建第一个UI
创建一个2D UI 制作UI时,首先要创建UI的"根".在Unity顶部NGUI菜单中选择Create,然后选择2D UI. 创建完成后,在Scene窗口中,NGUI自动生成了一个 ...
- Python按照索引访问list
由于list是一个有序集合,所以,我们可以用一个list按分数从高到低表示出班里的3个同学: >>> L = ['Adam', 'Lisa', 'Bart'] 那我们如何从list中 ...
- 关于xcode6打包以及上线前企业部署测试的说明 --转自张诚教授微博
xcode6如何打包 首先clean然后点击归档 点击打包之后保存 点选第一个以后检查相关证书签名 那么我们开发完以后,在上线前如何给别人测试 有2种方法 1.使用299美金的企业开发者账号搭建企业部 ...
- delphi xe5 android sample 中的 SimpleList 是怎样绑定的
C:\Users\Public\Documents\RAD Studio\12.0\Samples\FireMonkeyMobile 例子中的绑定方式如下图: 1.拖拽一个listview到界面上,然 ...
- web网页前端制作中的SEO方法
在SEO盛行的今天到处都在谈优化,对于网站前端制作人员来说,有几点是跟SEO相关 的,也就是SEO站内优化中的一部分,下面总结几点: 1.title,.页面的标题,不用多说,这个必须有! 2.keyw ...
- pow(x,y):返回x的y次幂
>>> pow(2,3) 8 >>> pow(2,5) 32 >>> pow(2,8) 256 另外一种求x的y次幂的方法: >>&g ...