Question

我正在写a website page，我想要这个：

当屏幕宽度太小时，请说您正在通过手机查看。我希望页面上只有文本（导航栏除外），没有背景图像，应调整字体大小以固定屏幕尺寸。

现在html代码有很多类，所以我的一个想法就是在通过手机浏览时禁用这些类（有很多）。

我的一些代码：

<section class="box">
   <img src="images/background2.jpg" class="img-responsive hidden-xs" alt="">
   <div class="carousel-caption text-background">
        <h1>Do you love to scuba dive? Are you looking for your next bid dive event?</h1>
        <h5>Look no further. Join ABI and other experienced divers throughout the year as we travel to amazing ocean resort destinations for state of the art diving experiences. Each trip will include
        multiple dives operated by experienced dive companies. All proceeds from these diving excursions will benefit the ABI Endowment Fund<a href="http://endowment.abi.org" target="_blank"> endowment.abi.org</a> 
        Do something you love while supporting the ABI Endowment Fund. Get more information about ABI's upcoming dive excursions.</h5>
   </div>
</section>

Answer 1

当您使用移动设备时，您可以使用php来检测设备是移动设备还是桌面设备。您可以使用类似的东西来检测它是否是移动设备：

<?php
function isMobile() {
    $iphone = strpos($_SERVER['HTTP_USER_AGENT'],"iPhone");
    $android = strpos($_SERVER['HTTP_USER_AGENT'],"Android");
    $palmpre = strpos($_SERVER['HTTP_USER_AGENT'],"webOS");
    $berry = strpos($_SERVER['HTTP_USER_AGENT'],"BlackBerry");
    $ipod = strpos($_SERVER['HTTP_USER_AGENT'],"iPod");
    if ($iphone || $android || $palmpre || $ipod || $berry == true) {
        return true;
    } else {
        return false;
    }
}
if (isMobile()===true) {
    echo "Device is Mobile";
}
?>

这只是为了检测设备是移动设备还是桌面设备，如果它是移动设备，if (isMobile()===true) {您可以将移动代码放在那里，或者您可以包含移动内容的文件。希望这有助于你！

Answer 2

col-xs适用于小型设备，请尝试这些行，

 <section class="box">
   <div class="container">
       <div class="col-xs-5">
     you are viewing via mobile phone.
       </div>
    </div>

   <img src="images/background2.jpg" class="img-responsive hidden-xs" alt="">
    <div class="carousel-caption text-background">
    <h1>Do you love to scuba dive? Are you looking for your next bid dive event?</h1>
    <h5>Look no further. Join ABI and other experienced divers throughout the year as we travel to amazing ocean resort destinations for state of the art diving experiences. Each trip will include
    multiple dives operated by experienced dive companies. All proceeds from these diving  excursions will benefit the ABI Endowment Fund<a href="http://endowment.abi.org"  target="_blank"> endowment.abi.org</a> 
    Do something you love while supporting the ABI Endowment Fund. Get more information  about ABI's upcoming dive excursions.</h5>
   </div>
 </section>

当宽度太小时，如何重写网页（仅限文本）

2 个答案: