div+css基础——6.采用div定位技术对div进行排版(绝对定位,不指定父容器)
2013-05-26 16:33
477 查看
<!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> <title>采用div定位技术对div进行排版(绝对定位,脱离文档流)</title> <meta name="keywords" content="自定义关键字"/> <meta name="description" content="自定义描述"/> <meta http-equiv="content-type" content="text/html;charset=utf-8"/> <style type="text/css"> #father{ background-color:#FFFF99; width:100%; height:100px; border:1px dashed green; } #son1{ position:absolute; /*相对于浏览器边框定位*/ right:0; } #son2{ } </style> </head> <body> <div> <div id="father"> <div id="son1">aaaaaaaaaa</div> <div id="son2">bbbbbbbbbb</div> <div id="son3">cccccccccc</div> </div> </div> </body> </html>
效果截图:
相关文章推荐
- div+css基础——6.采用div定位技术对div进行排版(绝对定位,不指定父容器)
- div+css基础——7.采用div定位技术对div进行排版(绝对定位,指定父容器)
- div+css基础——7.采用div定位技术对div进行排版(绝对定位,指定父容器)
- div+css基础——5.采用div定位技术对div进行排版(相对定位)
- div+css基础——5.采用div定位技术对div进行排版(相对定位)
- div+css基础——3.采用div浮动对div进行排版
- div+css基础——3.采用div浮动对div进行排版
- css使absolute相对于父容器进行定位而不是以body(为什么绝对定位(absolute)的父级元素必须是相对定位(relative))
- css基础 绝对定位 position:absolute 相对于document元素进行定位 (无定位的祖先元素)
- css基础 绝对定位 position:absolute 相对于document元素进行定位 (无定位的祖先元素)
- css基础 绝对定位 position:absolute 相对于定位的祖先元素进行定位
- css基础 绝对定位 position:absolute 相对于定位的祖先元素进行定位
- div+css基础——8.绝对定位应用(照片签名)
- div+css基础——8.绝对定位应用(照片签名)
- CSS实现垂直居中水平居中的绝对定位居中技术
- CSS 相对容器中绝对定位Bug
- 盘点8种CSS实现垂直居中水平居中的绝对定位居中技术
- DIV+CSS处理DIV设置float后,父容器无法定位高度的问题解决
- 图解DIV-CSS布局中绝对定位和浮动用法(两种分三栏布局的方法)
- 深入理解position:relative 与 position:absolute(divb相对于diva进行绝对定位)