gembin

          OSGi, Eclipse Equinox, ECF, Virgo, Gemini, Apache Felix, Karaf, Aires, Camel, Eclipse RCP

          HBase, Hadoop, ZooKeeper, Cassandra

          Flex4, AS3, Swiz framework, GraniteDS, BlazeDS etc.

          There is nothing that software can't fix. Unfortunately, there is also nothing that software can't completely fuck up. That gap is called talent.

          About Me

           

          解讀absolute與relative

          很多朋友問過我absolute與relative怎么區(qū)分,怎么用?我們都知道absolute是絕對(duì)定位,relative是相對(duì)定位,但是這 個(gè)絕對(duì)與相對(duì)是什么意思呢?絕對(duì)是什么地方的絕對(duì),相對(duì)又是相對(duì)于什么地方而言的呢?那他們又有什么樣的特性,可以做出什么樣的效果呢?關(guān)于兩者之間又有 什么樣的技巧呢?下面我們就來一一解讀。

          Absolute,CSS中的寫法是:position:absolute; 他的意思是絕 對(duì)定位,他是參照瀏覽器的左上角,配合TOP、RIGHT、BOTTOM、LEFT(下面簡(jiǎn)稱TRBL)進(jìn)行定位,在沒有設(shè)定TRBL,默認(rèn)依據(jù)父級(jí)的做 標(biāo)原始點(diǎn)為原始點(diǎn)。如果設(shè)定TRBL并且父級(jí)沒有設(shè)定position屬性,那么當(dāng)前的absolute則以瀏覽器左上角為原始點(diǎn)進(jìn)行定位,位置將由 TRBL決定。

          一般來講,網(wǎng)頁居中的話用Absolute就容易出錯(cuò),因?yàn)榫W(wǎng)頁一直是隨著分辨率的大小自動(dòng)適應(yīng)的,而Absolute則會(huì)以瀏覽器的左上角為原始 點(diǎn),不會(huì)應(yīng)為分辨率的變化而變化位置。很多人出錯(cuò)就在于這點(diǎn)上出錯(cuò)。而網(wǎng)頁居左其特性與Relative很相似,但是還是有本質(zhì)的區(qū)別的。

          Relative, CSS中的寫法是:position:relative;  他的意思是絕對(duì)相對(duì)定位,他是參照父級(jí)的原始點(diǎn)為原始點(diǎn),無父級(jí)則以BODY的原始點(diǎn)為原始 點(diǎn),配合TRBL進(jìn)行定位,當(dāng)父級(jí)內(nèi)有padding等CSS屬性時(shí),當(dāng)前級(jí)的原始點(diǎn)則參照父級(jí)內(nèi)容區(qū)的原始點(diǎn)進(jìn)行定位。

          有時(shí)我們還需要依靠z-index來設(shè)定容器的上下關(guān)系,數(shù)值越大越在最上面,數(shù)值范圍是自然數(shù)。當(dāng)然有一點(diǎn)要注意,父子關(guān)系是無法用z-index來設(shè)定上下關(guān)系的,一定是子級(jí)在上父級(jí)在下。

          posted on 2008-03-26 14:01 gembin 閱讀(376) 評(píng)論(0)  編輯  收藏 所屬分類: CSS

          導(dǎo)航

          統(tǒng)計(jì)

          常用鏈接

          留言簿(6)

          隨筆分類(440)

          隨筆檔案(378)

          文章檔案(6)

          新聞檔案(1)

          相冊(cè)

          收藏夾(9)

          Adobe

          Android

          AS3

          Blog-Links

          Build

          Design Pattern

          Eclipse

          Favorite Links

          Flickr

          Game Dev

          HBase

          Identity Management

          IT resources

          JEE

          Language

          OpenID

          OSGi

          SOA

          Version Control

          最新隨筆

          搜索

          積分與排名

          最新評(píng)論

          閱讀排行榜

          評(píng)論排行榜

          free counters
          主站蜘蛛池模板: 佛山市| 藁城市| 吴桥县| 肇源县| 维西| 中西区| 安龙县| 禄劝| 景德镇市| 柯坪县| 宁阳县| 昌吉市| 壶关县| 高邑县| 金塔县| 曲水县| 天等县| 巴东县| 扶沟县| 南靖县| 上栗县| 迁西县| 西吉县| 平顶山市| 乐清市| 赞皇县| 贵阳市| 桦川县| 临高县| 东光县| 枝江市| 青河县| 鄱阳县| 石泉县| 兴隆县| 五原县| 惠安县| 晋江市| 三门县| 淮阳县| 武平县|