• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

brak wersji mobilnej strony na bootstrapie

VPS Starter Arubacloud
0 głosów
333 wizyt
pytanie zadane 13 października 2017 w HTML i CSS przez Q_Nick Mądrala (5,010 p.)
Tworzę sobie stronę internetową, tylko mam problem, ponieważ nie pojawia jej wersja mobilna, w którą powinna zamieniać się automatycznie. Wygląda ona na telefonie identycznie jak na komputerze, jednak jak zwężę okno na komputerze menu zamienia się w mobilne. Nie mam żadnych wymiarów ustalonych na sztywno, w sumie w własnym css mam tylko tło. Ktoś wie w czym leży problem?
komentarz 13 października 2017 przez kubaapk Nałogowiec (44,270 p.)
Kod.
komentarz 13 października 2017 przez Q_Nick Mądrala (5,010 p.)
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>
           ***        </title>
         
        <!--Bootstrap-->
        <script type="text/javascript" src="http://192.168.1.106/***/libs/jquery-3.1.0.min.js"></script>
        <script type="text/javascript" src="http://192.168.1.106/**/css/bs3/js/bootstrap.min.js"></script>
        <script type="text/javascript" src="http://192.168.1.106/***/libs/ckeditor/ckeditor.js"></script>
        <link rel="Stylesheet" type="text/css" href="http://192.168.1.106/***/css/bs3/css/bootstrap.css">
        <!--End Bootstrap-->
         
        <link rel="Stylesheet" type="text/css" href="http://192.168.1.106/***/css/style.css">
         
    </head>
    <body>
        <nav class="navbar navbar-default">
    <div class="container-fluid">
         
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="#">Brand</a>
        </div>
 
        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
 
            <ul class="nav navbar-nav navbar-right">
                 
                <li><a href="http://192.168.1.106/***/home">Strona startowa</a></li>
                <li><a href="http://192.168.1.106/***/contact">Kontakt</a></li>
                <li><a href="http://192.168.1.106/***/catalog">Katalog</a></li>
                <li><a href="http://192.168.1.106/***/shops">Nasze sklepy</a></li>
                 
            </ul>
        </div>
         
    </div>
</nav><main class="">
<div id="carousel-example-generic2" class="carousel slide">
 
    <ol class="carousel-indicators">
        <li data-target="#carousel-example-generic2" data-slide-to="0" class="active"></li>
        <li data-target="#carousel-example-generic2" data-slide-to="1"></li>
        <li data-target="#carousel-example-generic2" data-slide-to="2"></li>
        <li data-target="#carousel-example-generic2" data-slide-to="3"></li>
        <li data-target="#carousel-example-generic2" data-slide-to="4"></li>
    </ol>
 
    <div class="carousel-inner">
 
 
        <div class="item active">
             
            <img src="http://placehold.it/1280x500" alt="">
             
            <div class="carousel-caption">
                <h3>To jest opis</h3>
                <p>pierwszego slajdu</p>
            </div>
             
        </div>
        <div class="item">
             
            <img src="http://placehold.it/1280x500" alt="">
             
            <div class="carousel-caption">
                <h3>To jest opis</h3>
                <p>pierwszego slajdu</p>
            </div>
             
        </div>
        <div class="item">
             
            <img src="http://placehold.it/1280x500" alt="">
             
            <div class="carousel-caption">
                <h3>To jest opis</h3>
                <p>pierwszego slajdu</p>
            </div>
             
        </div>
        <div class="item">
             
            <img src="http://placehold.it/1280x500" alt="">
             
            <div class="carousel-caption">
                <h3>To jest opis</h3>
                <p>pierwszego slajdu</p>
            </div>
             
        </div>
        <div class="item">
             
            <img src="http://placehold.it/1280x500" alt="">
             
            <div class="carousel-caption">
                <h3>To jest opis</h3>
                <p>pierwszego slajdu</p>
            </div>
             
        </div>
 
    </div>
 
   
    <a class="left carousel-control" href="#carousel-example-generic2" data-slide="prev">
        <span class="icon-prev"></span>
    </a>
    <a class="right carousel-control" href="#carousel-example-generic2" data-slide="next">
        <span class="icon-next"></span>
    </a>
</div>
 
</main>    </body>
</html>

 

1 odpowiedź

+1 głos
odpowiedź 13 października 2017 przez imklau Nałogowiec (42,090 p.)
wybrane 13 października 2017 przez Q_Nick
 
Najlepsza

strzelam, że brakuje Ci tego:

<meta name="viewport" content="width=device-width, initial-scale=1.0">

Inaczej tak jak mówisz na tel będzie Ci się tak samo wyświetlać, jak na kompie ;)

 

komentarz 13 października 2017 przez Q_Nick Mądrala (5,010 p.)
Dziękuje, nie wiedziałem o tym :)

Podobne pytania

0 głosów
0 odpowiedzi 57 wizyt
0 głosów
2 odpowiedzi 591 wizyt
pytanie zadane 17 lipca 2017 w HTML i CSS przez leemish Użytkownik (780 p.)
0 głosów
0 odpowiedzi 196 wizyt
pytanie zadane 25 maja 2022 w HTML i CSS przez renegat Obywatel (1,020 p.)

92,452 zapytań

141,262 odpowiedzi

319,074 komentarzy

61,854 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...