css层固定位置练习

2016-02-19 20:21 5 1 收藏

下面图老师小编跟大家分享css层固定位置练习,一起来学习下过程究竟如何进行吧!喜欢就赶紧收藏起来哦~

【 tulaoshi.com - Web开发 】

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
html xmlns="http://www.w3.org/1999/xhtml"
head
meta http-equiv="Content-Type" content="text/html; charset=utf-8" /
title层固定位置练习--by 阿会楠/title
style type="text/css"
html,body{
    overflow:hidden;
    padding:0;
    margin:0;
    width:100%;
    height:100%;
}
#_body{
    height:100%;
    overflow-y:scroll;
    width:100%;
    height:100%;
}
#adDiv{
    position:absolute;
    z-index:99999;
    bottom:10px;
    left:10px;
    width:200px;
    height:30px;
    border:1px solid #8A9ABB;
    background:#F0F4F7;
    font:12px tahoma;
    text-align:center;
    line-height:30px;
}
/style
/head

body
div id="adDiv"www.dibrg.com/div
div id="_body"
/div
/body
/html

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

资料引用:http://www.knowsky.com/441324.html

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

来源:http://www.tulaoshi.com/n/20160219/1623448.html

延伸阅读
定位一直是WEB标准应用中的难点,如果理不清楚定位那么可能应实现的效果实现不了,实现了的效果可能会走样。如果理清了定位的原理,那定位会让网页实现的更加完美。 定位的定义 : 在CSS中关于定位的内容是:position:relative | absolute | static | fixed static 没有特别的设定,遵循基本的定位规定,不能通过z-inde...
标签: Web开发
1. position:static|无定位 position:static是所有元素定位的默认值, 一般不用注明,除非有需要取消继承的别的定位 example: #div-1 { position:static; } 2. position:relative|相对定位 使用position:relative,就需要top,bottom,left,right4个属性来配合,确定元素的位置。 如果要让div-1层向下移动20px,左移4...
英文原文:http://brainjar.com/css/positioning/default.asp 翻译:零度,转载请注明本文英文原文出处以及本文地址!由于我英文水平有限,有不懂的地方还请阅读原文,欢迎交流! 相对定位 当一个元素被指明为{position:relative;}的时候,它开始是遵守正常流规则的(也就是说,如果你不给他任何规则,他就和正常的一样,译者注)...
标签: Web开发
定位一直是WEB标准应用中的难点,如果理不清楚定位那么可能应实现的效果实现不了,实现了的效果可能会走样。如果理清了定位的原理,那定位会让网页实现的更加完美。 定位的定义: 在CSS中关于定位的内容是:position:relative | absolute | static | fixed static 没有特别的设定,遵循基本的定位规定,不能通过z-index进行层次分级。 relat...
标签: Web开发
使用CSS可以固定背景,格式如下: 标签名{background-attachment:参数} 参数: fixed:页面滚动时,背景固定; scroll:页面滚动时,背景滚动。 实例: html style type="text/css" !--     p.1{ background-attachment:fixed;  background-repeat:no-repeat;background-image:url(mgc.jpg);font-size:100mm}  &n...

经验教程

295

收藏

84
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部