Question

当我在笔记本电脑上时，我的网站就是我想要的。我的网站的顶部是固定的，当我调整窗口大小时，一切都随着窗口调整大小。但是，当我使用我的iPhone时，它会给我缩小版本的网站，而我的网站顶部也没有修复。

    <head>
    <title>Home page</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <link rel="stylesheet" href="style.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>

我包含了用于bootstrap的CDN和视口。我尝试调整视口，我无法弄明白。

iPhone截图：

我的笔记本电脑的屏幕截图：

正文HTML：

<div class="container-fluid">
        <div class="row">
            <div id="NavTop">
                <a href="#">Carlo Aclao</a>
                <p><a href="#">About</a> | <a href="#">Resume</a> | <a href="#">Work</a></p>
            </div>
        </div>
        <div class="row">
            <div id="Introduction">
                <p>$echo Welcome, Currently I am a computer science student, future software developer.</p>
            </div>
        </div>
        <div class="row" id="Info1">
                <div id="slider">
                    <img class="sliderPicture" src="images/PictureOne.jpg" alt="First Image">
                </div>
        </div>
        <div class="row" id="About">
            <div id="About1">
                <p><span class="darker">CarloAclao myLife = new CarloAclao();</span></p>
                <p><span class="darker">myLife.Origin()</span>      >> Born in the Philippines, New Jersey Resident for 15 years.</p>
                <p><span class="darker">myLife.Education()</span>   >> Currently a second year student at Raritan Valley CC. Future student at Montclair State University.</p>
                <p><span class="darker">myLife.Major()</span>       >> Computer Science</p>
                <p><span class="darker">myLife.HomeLife()</span>    >> Everything peeks my interest, anywhere from gaming to sports to health.
                Looking forward to traveling the world and expericing all the different cultures
                that this world has to offer. I am both an avid regular sports and also, esports fan
                . I currently invest in cryptocurrency, blockchain will reinvent what we do today and in my opinion
                will win in the macro. I also have two dogs that relax me when needed.</p>
                <p><span class="darker">myLife.WorkLife()</span>    >> I have always been comfortable around a computer. Coding has stepped that to the next level,
                seeing something that I have helped create satisfies me like nothing else. I like to believe that I am
                good at coding, I have a healthy balance of thinking algorthimically and inuitively. I enjoy learning and I am
                always motivated to be the best in anything I do. I always question how things work, and like to find more efficient
                ways of doing it.</p>

            </div>




        </div>

Answer 1

这是因为您没有使用任何 Bootstrap类来使您的网站响应。完全没有。

因此，如果您的HTML中没有任何响应代码，那么您不能指望您的网站能够做出响应。

您的所有内容都必须进入Bootstrap列。所有内容都不能直接进入Bootstrap行。

Bootstrap列是唯一可以作为Bootstrap行的直接子节点的元素。

网站是对笔记本电脑的响应，但不是在iPhone上

1 个答案: