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

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

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

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

          Relative, CSS中的寫法是:position:relative;  他的意思是絕對(duì)相對(duì)定位,他是參照父級(jí)的原始點(diǎn)為原始點(diǎn),無(wú)父級(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來(lái)設(shè)定容器的上下關(guān)系,數(shù)值越大越在最上面,數(shù)值范圍是自然數(shù)。當(dāng)然有一點(diǎn)要注意,父子關(guān)系是無(wú)法用z-index來(lái)設(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
          主站蜘蛛池模板: 阳谷县| 册亨县| 东海县| 永胜县| 林周县| 福州市| 积石山| 洛阳市| 拉孜县| 巩留县| 根河市| 扬州市| 奉贤区| 灌阳县| 阳城县| 沭阳县| 彰武县| 宜都市| 蒙城县| 黄梅县| 大丰市| 巴彦淖尔市| 都兰县| 荣昌县| 新密市| 保定市| 阿坝县| 巴彦淖尔市| 阿荣旗| 井研县| 大名县| 云南省| 游戏| 永泰县| 沅江市| 临夏市| 孟连| 五峰| 靖宇县| 梅河口市| 郯城县|