Nové výhodné předplatné namísto kreditů je tu! Více informací. Upravili jsme také naše provozní podmínky.
NOVINKA: Staň se datovým analytikem a získej jistotu práce, lepší plat a nové kariérní možnosti. Více informací:
Avatar
Jan Chaloupka
Člen
Avatar
Jan Chaloupka:28.7.2021 13:54

Na mých stránkách, kde mám mobilní zobrazení přes @media screen and (max-width: Xpx) mi nefunguje zobrazení pro PC.
Je to chybou v CSS nebo na to musím udělat JS podmínku?
Díky

Zkusil jsem: Zkoušel jsem, zda na to neexistuje podmínka v JS, ale nic jsem nenašel.

Chci docílit: Aby šla moje stránka zobrazit ve verzi pro PC v mobilu.

 
Odpovědět
28.7.2021 13:54
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:29.7.2021 11:31

Podivej se, jak media resi css bootstrap.
https://getbootstrap.com/…layout/grid/
https://getbootstrap.com/…ed/download/
https://getbootstrap.com/…les/pricing/
Si to stahni, mela by tm byt i neminifikovana verze. Pripadne si najdi priklady googlem.

  • nedal jsi zkopirovatelny kod
  • nenapsal, co to dela
  • neukazal kod tvych pokusu

Treba mas jen spatne zavorky.
Takze mas rozbite auto v garazi. Co ti ma asi odpovedet automechanik v dilne, ze s nim mas spatne?

google = css media example mobile

<style>
/*ruzne kody nalezene googlem*/
@media screen {  /* media je screen { css } */
    * { / * vsechny elementy */
        background: silver
    }
}
---
@media screen and (min-width: 480px) { /*zapis pro min-width*/
    div {
        float: left;
        background: red;
    }
}
---
https://www.freecodecamp.org/news/css-media-queries-breakpoints-media-types-standard-resolutions-and-more/
.text {
  font-size: 14px;
}

@media (max-width: 480px) {
  .text {
    font-size: 16px;
  }
}

</style>

a jeste se da linkovat styl pres link
<link rel="stylesheet" type="text/css" href="screen.css" media="screen">
<link rel="stylesheet" type="text/css" href="print.css"  media="print">

Jestli je to mobil nebo ne, se urcuje podle sirky obrazovky. A device je pak zorazovaci zarizeni. Treba print je pro tisk na tiskarne. Treba chces, kdyz si nekdo tiskne stranku, aby tam nemel menu a tim padem mel vice prostoru pro obsah.
Kdyz tm nedas ani screen, ani print, tak se jedna o vsechna, viz posledni priklad z kodu.

 
Nahoru Odpovědět
29.7.2021 11:31
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 2 zpráv z 2.