CSS absolute特性及應用

2021-07-09 04:24:34 字數 1101 閱讀 3498

1.      absolute的特性

(1)  可以超越overflow

滑動滑塊,關閉按鈕不動

(2)  無依賴的absolute

1) 折翼的天使、去浮動、位置跟隨

此種情況,如果先給第二張**設定float再設absolute與只設定absolute效果一樣。說明absolute具有去浮動性。inline或inline-block的元素浮動後效果如上圖,block的元素浮動後依然是單行顯示,不會因為absolute而inline化。

2) 使用margin精確定位

absolute化的元素,在不依賴父元素relative的情況下,可以與普通元素一樣使用margin實現精確定位,包括負值定位。

2.  absolute特性的應用(主要計畫好absolute元素在html中的位置)

(1)  圖示定位

推薦

分享:css深入理解之float浮動

已完結3514人學習

總結:圖示絕對定位,用margin來進行圖示位置微調。效果如下。

(2)   absolute實現下拉框

一般會父元素relative,下拉框用left、top值控制,現在只用absolute實現

(3) 用text-align:center居中定位absolute元素

圖中慕客圖示寬度為52px,故margin-left:-26px

下圖比較實用,父元素text-align:right,子元素fixed

(4) 註冊頁面星號對齊

(5)字元圖示對齊

注意:margin-left的值為負的圖示寬度

(6) 溢位容器可顯示

absolute後不佔據實際位置,哪怕只有0px,絕對定位的元素仍然會跟在html文件中它之前的元素後。

3.  absolute浮動(top left bottom right)

(1)   如何限制浮動範圍

(2) left right topbottom 與 width height

1)0.5 黑色遮罩層實現

注意:絕對定位的居中效果!

JAVA基礎特性 ThreadLocal 應用

threadlocal是什麼呢?其實threadlocal並非是乙個執行緒的本地實現版本,它並不是乙個thread,而是thread local variable 執行緒區域性變數 也許把它命名為threadlocalvar更加合適,他實現了執行緒的變數隔離,不同的執行緒可以維護自己的變數,他在內部...

C 列舉特性 FlagAttribute 的應用

列舉enum 全稱 enumeration 即一種由一組稱為列舉數列表的命名常量組成的獨特型別。可以看出列舉的出現時為了使我們可以在程式中方便的使用一些特定值的常量,一般的使用大家都比較熟悉,本文主要介紹列舉的特性 flagattribute。flag 特性微軟的解釋是 指示可以將列舉作為位域 即一...

PowerDesigner及UML建模應用

一 pd簡介 powerdesigner 是乙個集所有現代建模技術於一身的完整工具,它整合了強有力的業務建模技術 傳統的資料庫分析和實現,以及uml物件建模。通過了元資料的管理 衝突分析和真正的企業知識庫等功能。利用它可以製作資料流程圖 概念資料模型 物理資料模型 幫助企業快速高效地進行企業應用系統...