<big id="buzql"></big>
  • <label id="buzql"></label><strike id="buzql"><blockquote id="buzql"><em id="buzql"></em></blockquote></strike>
    <strike id="buzql"><delect id="buzql"><em id="buzql"></em></delect></strike>
    <strike id="buzql"></strike>

        廣東福建浙江江蘇上海北京山東遼寧江西河南四川湖北湖南廣西安徽黑龍江天津重慶吉林河北貴州甘肅山西云南新疆寧夏海南陜西西藏青海內蒙古

        新聞中心

        CSS固定定位
        發(fā)布時(shí)間:2014-10-11 23:27:32

        不知道您是否留意了,瀏覽本站時(shí),瀏覽器右下角有一個(gè)標著(zhù)top的黑色直角三角形,可以點(diǎn)擊它返回到正在瀏覽的網(wǎng)頁(yè)頁(yè)眉。當滾動(dòng)網(wǎng)頁(yè)時(shí),它的位置一直沒(méi)有任何改變,您感覺(jué)它怎么樣?這就是通過(guò)CSS的定位屬性來(lái)實(shí)現的,通過(guò)它可以讓HTML元素脫離文檔流固定在瀏覽器的某個(gè)位置。

        IE7、Firefox、Opera,都支持CSS的,所以很容易實(shí)現(《詳解定位與定位應用》)
        IE6不支持該屬性,但是在使用!DOCTYPE 聲明指定standards-compliant(標準)模式可以通過(guò)CSS hack實(shí)現
        上述聲明下IE5和IE5.5目前沒(méi)有發(fā)現通過(guò)純粹CSS能夠解決的方案,但是可以通過(guò)IE特有的expression在CSS中實(shí)現(移動(dòng)網(wǎng)頁(yè)時(shí)固定元素會(huì )動(dòng)),這和常見(jiàn)浮動(dòng)Logo廣告利用Javascript實(shí)現原理是一樣的,只不過(guò)可以直接寫(xiě)在CSS中比較簡(jiǎn)便的
        利用IE獨有的條件注釋語(yǔ)句可以針對不同的IE版本精確設置,同時(shí)避免了這些代碼被其他瀏覽器讀到,個(gè)人認為比純粹的CSS Hack好,如果你安裝了多個(gè)IE(包括綠色版本),條件注釋將會(huì )以最高版本的IE為標準。
        實(shí)現代碼如下:

        "">


        ......

        IE6中利用容器對溢出內容的處理方式來(lái)實(shí)現的




        ......




        代碼演示1(單個(gè)IE,純粹通過(guò)條件注釋區分IE瀏覽器)

        代碼演示2(多個(gè)IE,通過(guò)條件注釋+CSS hack區分IE瀏覽器,明顯的比純粹條件注釋復雜且不易讀,放上來(lái)主要是便于同個(gè)PC擁有多個(gè)IE瀏覽器朋友[一般應該做是web開(kāi)發(fā)的]可以直接看到效果,下同。)

        或許有人像我一樣,在!DOCTYPE 聲明是XHTML1.0 Strict或者是XHTML1.1時(shí),喜歡在聲明前面加上XML Prolog(如:),但此時(shí)IE7以下都處于quriksQuirks(兼容)模式,所以上述針對IE6的Hack失效,這個(gè)時(shí)候你可以對IE6也通過(guò)expression來(lái)實(shí)現。

        當IE6處于quriks模式時(shí),IE6和IE5.5對CSS解析方式幾乎雷同,所以當看到《position:fixed for Internet Explorer》時(shí),我找到了在quriksQuirks模式下IE6/IE5.5/IE5統一的CSS解決方案:


        "">


        ......



        ......




        代碼演示3(單個(gè)IE,純粹通過(guò)條件注釋區分IE瀏覽器)

        代碼演示4(多個(gè)IE,通過(guò)條件注釋+CSS hack區分IE瀏覽器)

        對比兩個(gè)純粹的CSS hack發(fā)現,兩個(gè)原理似乎相同,在于html元素和body元素的應用和對CSS的的支持程度上,但是這實(shí)際上是一種Hack,基本上不具備通用性,知道這個(gè)方法就可以了。需要提醒的是IE6 standards-compliant模式下HTML元素不管給它設置什么樣的高度和寬度,它的大小都始終充滿(mǎn)整個(gè)瀏覽器的可視區域,而IE5 以及 Quirks 模式下html元素和body元素所有寬高設置都會(huì )被忽略而保持充滿(mǎn)瀏覽器的可視區域,更多內容請看《IE 中的 html 元素》

        或許有人會(huì )想,現在可以引入了XML Prolog又能用純CSS方法解決了IE7以下的問(wèn)題,這下爽了,但是加上XML Prolog后突然發(fā)現IE6處于quriksQuirks模式,以前在standards-compliant模式下的設計又變形了,呵呵,這就是咱們搞IE的下場(chǎng)。


        相關(guān)說(shuō)明: 您可以通過(guò)電話(huà):020-85421558 與我們聯(lián)系,我們會(huì )根據您所從事的行業(yè)領(lǐng)域和網(wǎng)站類(lèi)型,在最短的時(shí)間內請我們的營(yíng)銷(xiāo)顧問(wèn)與您預約后上門(mén)拜訪(fǎng)您,直接面談交流為您解答所有的網(wǎng)站建設疑問(wèn)。
        洲欧美偷国产日韩p|欧美性xxxxx极品少妇|色天天躁夜夜躁天干天干|欧美黑人又大又粗XXXXX|人妻少妇88久久
        <big id="buzql"></big>
      1. <label id="buzql"></label><strike id="buzql"><blockquote id="buzql"><em id="buzql"></em></blockquote></strike>
        <strike id="buzql"><delect id="buzql"><em id="buzql"></em></delect></strike>
        <strike id="buzql"></strike>

            上一篇:全面了解CSS內置顏色(color)值       下一篇:CSS欺騙,讓背景不能滾動(dòng)

            提供全國各地網(wǎng)站建設服務(wù)

            上海北京深圳廣州天津南京大連杭州沈陽(yáng)成都東莞濟南佛山無(wú)錫長(cháng)沙武漢寧波長(cháng)春蘇州青島珠海大慶福州廈門(mén)常州鄭州煙臺西安合肥南寧重慶東營(yíng)昆明威海中山南昌紹興太原惠州溫州徐州揚州淄博鎮江鞍山保定銀川南通洛陽(yáng)嘉興臺州桂林貴陽(yáng)蘭州盤(pán)錦漳州黃石唐山濰坊湘潭肇慶吉林江門(mén)?株洲泉州泰州包頭柳州德州韶關(guān)寶雞金華鹽城新鄉十堰廊坊玉溪濟寧滄州蕪湖湖州梧州泰安安陽(yáng)遼陽(yáng)舟山梅州常德三明連云港哈爾濱秦皇島馬鞍山石家莊呼和浩特

             
            備案系統認證 舉報不良網(wǎng)站 我們的支付方式 AAA級信用
            廣州萬(wàn)戶(hù)網(wǎng)絡(luò )信息科技有限公司 旗下網(wǎng)站建設品牌:萬(wàn)戶(hù)網(wǎng) www.mymeet168.com 版權所有 ©2000-2019 All Rights Reserved
            網(wǎng)站備案編號:粵ICP備15049595號 地址:廣州市番禺區大石街北聯(lián)圍仔工業(yè)路2號E座305
            電話(huà):020-85421558   傳真:020-88140140   郵編:510515