前面的话
之前的博客文章已经详细介绍过绝对定位的基础知识，由于它的用途实在广泛，于是单独为其写这篇关于其应用的博客。关于绝对定位的基础知识移步至此
静态位置
当元素绝对定位后，若该元素的格式化属性不发生变化，则该元素处于静态位置。关于绝对定位元素格式化的相关内容移步至此。元素的静态位置是指元素在正常流中原本的位置，更确切的讲，顶端的静态位置是从包含块的上边界到假想框的上外边距边界之间的距离。假想框是假设元素position属性为static时元素的第一个框。
应用
以下是基于绝对定位静态位置的应用
【1】自适应位置的跟随图标
图标使用不依赖定位父级的absolute和margin属性进行定位，这样，当文本的字符个数改变时，图标的位置可以自适应
div{ height: 20px; width: 500px; line-height: 20px; margin-bottom: 30px;} i{ position: absolute; width: 28px; height: 11px; margin: -6px 0 0 2px; background: url('http://sandbox.runjs.cn/uploads/rs/26/ddzmgynp/hot.gif');}
长度可变文字
查看更多关于CSS绝对定位的应用_html/css_WEB-ITnose的详细内容...
声明：本文来自网络，不代表【好得很程序员自学网】立场，转载请注明出处：http://haodehen.cn/did111571