成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

Css實(shí)現(xiàn)手機(jī)端頁面強(qiáng)制橫屏

lieeps / 3391人閱讀

摘要：檢測手機(jī)豎屏下，提示用關(guān)閉屏幕旋轉(zhuǎn)鎖定，并橫置手機(jī)。想想手機(jī)瀏覽器還是豎屏，而內(nèi)容卻被強(qiáng)制橫屏的畫面有多奇怪吧頁面強(qiáng)制橫屏是一碗都快放壞了的冷飯。但文主百度到的解決方法都用了。文主覺得有些高炮打蚊子。所以自己用實(shí)現(xiàn)了一個(gè)。

樣式 
@media screen and (orientation: portrait) {
    html{
        width : 100vmin;
        height : 100vmax;
    }
    body{
        width : 100vmin;
        height : 100vmax;
    }
    #gyroContain{
        width : 100vmax;
        height : 100vmin;
        transform-origin: top left;
        transform: rotate(90deg) translate(0,-100vmin);
    }
  }
@media screen and (orientation: landscape) {
    html{
        width : 100vmax;
        height : 100vmin;
    }
    body{
        width : 100vmax;
        height : 100vmin;
    }
    #gyroContain{
        width : 100vmax;
        height : 100vmin;
    }
}
結(jié)構(gòu) 

    
        

            非常多非常多的文字

P.S. 如果你的頁面里有from表單要填的話，應(yīng)該用 「彈出遮罩層讓用戶旋轉(zhuǎn)手機(jī)」 的解決方案。檢測手機(jī)豎屏下，提示用關(guān)閉屏幕旋轉(zhuǎn)鎖定，并橫置手機(jī)。想想手機(jī)瀏覽器還是豎屏，而內(nèi)容卻被強(qiáng)制橫屏的畫面有多奇怪吧...

P.S. 頁面強(qiáng)制橫屏是一碗都快放壞了的冷飯。但文主百度到的解決方法都用了js。文主覺得有些高炮打蚊子。所以自己用Css+Html實(shí)現(xiàn)了一個(gè)。文章內(nèi)的代碼只是一個(gè)給大家發(fā)散思維的littleDemo，你們想豎屏滾動(dòng)就去掉height加y-auto, 想有背景色就加bg-color，還望大家不要討伐我的不嚴(yán)謹(jǐn)啊。第一篇文章，望海涵。

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://m.hztianpu.com/yun/117543.html

相關(guān)文章

  • Css實(shí)現(xiàn)手機(jī)端頁面強(qiáng)制橫屏

    摘要：檢測手機(jī)豎屏下，提示用關(guān)閉屏幕旋轉(zhuǎn)鎖定，并橫置手機(jī)。想想手機(jī)瀏覽器還是豎屏，而內(nèi)容卻被強(qiáng)制橫屏的畫面有多奇怪吧頁面強(qiáng)制橫屏是一碗都快放壞了的冷飯。但文主百度到的解決方法都用了。文主覺得有些高炮打蚊子。所以自己用實(shí)現(xiàn)了一個(gè)。 樣式 @media screen and (orientation: portrait) { html{ width : 100vmin; ...

    graf 評論0 收藏0

  • CSS常用代碼

    摘要：文字換行強(qiáng)制不換行自動(dòng)換行強(qiáng)制英文單詞斷行兩端對齊去掉瀏覽器中文本框或的黃色焦點(diǎn)框去掉記住密碼后自動(dòng)填充表單的黃色背景最小高度兼容代碼鼠標(biāo)不允許點(diǎn)擊平臺(tái)字體優(yōu)化微軟雅黑文字過多后顯示省略號(hào) 1. css 2.x 文字換行 /*強(qiáng)制不換行*/ white-space:nowrap; /*自動(dòng)換行*/ word-wrap: break-word; word-break: normal; /...

    Eirunye 評論0 收藏0

  • CSS常用代碼

    摘要：文字換行強(qiáng)制不換行自動(dòng)換行強(qiáng)制英文單詞斷行兩端對齊去掉瀏覽器中文本框或的黃色焦點(diǎn)框去掉記住密碼后自動(dòng)填充表單的黃色背景最小高度兼容代碼鼠標(biāo)不允許點(diǎn)擊平臺(tái)字體優(yōu)化微軟雅黑文字過多后顯示省略號(hào) 1. css 2.x 文字換行 /*強(qiáng)制不換行*/ white-space:nowrap; /*自動(dòng)換行*/ word-wrap: break-word; word-break: normal; /...

    ddongjian0000 評論0 收藏0

  • CSS常用代碼

    摘要：文字換行強(qiáng)制不換行自動(dòng)換行強(qiáng)制英文單詞斷行兩端對齊去掉瀏覽器中文本框或的黃色焦點(diǎn)框去掉記住密碼后自動(dòng)填充表單的黃色背景最小高度兼容代碼鼠標(biāo)不允許點(diǎn)擊平臺(tái)字體優(yōu)化微軟雅黑文字過多后顯示省略號(hào) 1. css 2.x 文字換行 /*強(qiáng)制不換行*/ white-space:nowrap; /*自動(dòng)換行*/ word-wrap: break-word; word-break: normal; /...

    Java_oldboy 評論0 收藏0

發(fā)表評論

0條評論

閱讀需要支付1元查看
<