Bootstrap 3

9

Bootstrap 3

offline
  • Pridružio: 25 Mar 2015
  • Poruke: 548

Napisano: 16 Jun 2015 10:54

Kako da odradim box samo za jedan col-md-2 ovako je za celi container
  .pozadina_aktuelnosti_2 {    margin: 5px 5px 5px 5px;    width: auto;    background: #fff;     box-shadow: 5px 5px 10px #888888;    background-color: #FFF;    border: 3px solid #E7E7E7;   }




Na primer za jedan ovaj mali col-md-2



Odradio sam ovo
css
.prvibox {   margin: 5px 5px 5px 5px;    width: auto;    background: #fff;     box-shadow: 10px 10px 5px #888888;    background-color: #FFF;    border: 3px solid #E7E7E7;   } isto kao kod celog containera ali se ne desava nista

html



Radi ovako, sad samo da se podesi da lepo izgleda.



Registruj se da bi učestvovao u diskusiji. Registrovanim korisnicima se NE prikazuju reklame unutar poruka.
offline
  • Pridružio: 25 Mar 2015
  • Poruke: 548

Dopuna: 16 Jun 2015 15:24

dejnik978 ::Iskodirao sam ovako nesto, sad me zanima koja je skripta js npr ili nesto slicno koja bi odvajala ove blokove da kad prelazim misem preko njih da se pomeraju da li to radi jquery ili? Ako moze neki link da pogledam, hvala



Reseno:

Ova skripta moze da pomera div samo da se podesi
$(document).ready(function() {    $('div').mouseenter(function() {        $(this).animate({            height: '+=10px'        });    });    $('div').mouseleave(function() {        $(this).animate({            height: '-=10px'        });    });    $('div').click(function() {        $(this).toggle(1000);    }); });



offline
  • Pridružio: 25 Mar 2015
  • Poruke: 548

Novi update bootstrapa 3.3.5
http://blog.getbootstrap.com/2015/06/15/bootstrap-3-3-5-released/

offline
  • Pridružio: 25 Mar 2015
  • Poruke: 548

Da li je ispravno da odvojim ova dva containera ovako, nema problema na manjim rezolucijama
margin: 50px 20px 50px 20px;

.prvi_deo {    color:#C2C4C0;    text-align: center;    box-shadow: 0 0 2px black;    padding-bottom: 10px 0 0 10px;    margin: 50px 20px 50px 20px; } .drugi_deo {    color:#C2C4C0;    text-align: center;    box-shadow: 0 0 2px black; }


offline
  • Pridružio: 25 Mar 2015
  • Poruke: 548

Napisano: 18 Jun 2015 1:49

Vezbam ovako nesto i opera nece da prihvati boju za h2. Trenutno ne vidim zasto a radi na firefoxu.
Opera ne prihvata boju za h2


Firefox prihvata boju



cod
 <div class="prvi_deo">                 <div class="container">                     <div class="row">                       <div class="col-md-12">                           <h2><a href="#">Kalendar radova u malinarstvu</a></h2>                           <p>Jun</p>                           <p>Berba malina</p>                           <p>                             Prskanje malina preparatima protiv bolesti –Switch<br> (pred berbu, pre nego što su plodovi zreli).<br>  Berba i prodaja malina. <br> Navodnjavanje malina (ako ima potrebe).                                 </p>                       </div>                     </div>                 </div>               </div>
a:link { color:#7B9E67; text-decoration: none; } a:hover {    color:red; } .prvi_deo {        text-align: center;    box-shadow: 0 0 2px black;    padding-bottom: 5px 0 0 5px;    margin: 50px 20px 50px 20px;    color:#7B9E67;     } .prvi_deo h2 {    font-family: 'Alex Brush', cursive;    font-weight: bold;    font-size: 44px;    color:#7B9E67; }

Interesuje me i ovo posto vdim da se u css-u dosta toga ponavlja da podesim npr za classu pa za istu posebno h2, pa h3, pa za p itd pa css ode u 1m. To bi trebalo da resi Sass ili ? na ovoj adresi ima nesto za pocetnike
http://www.1stwebdesigner.com/learning-sass/

Kako ide za pocetnike, kako ste vi poceli? Hvala pozdrav

Dopuna: 18 Jun 2015 13:40

Neznam zasto ali sada radi na oba browsera boja za h2

offline
  • m4rk0  Male
  • Administrator
  • Administrator tech foruma
  • Marko Vasić
  • Gladijator - Maximus Decimus Meridius
  • Pridružio: 14 Jan 2005
  • Poruke: 15766
  • Gde živiš: Majur (Colosseum)

Prvo sto treba da uradis kada sumnjas da browser "ne prihvata" neki code koji bi ocigledno morao da radi, pritisni ctrl+f5 dok si na toj stranici koju pregledas. Ume cache da zeza, a ova kombinacija je upravo lek za takve stvari.

offline
  • Pridružio: 25 Mar 2015
  • Poruke: 548

Vezbam ovako nesto da li je ispravno ovako. Rad u bootstrap okruzenju
Da povezem stranice u php-u
<?php require 'includes/jumbotron.php';?>
<?php require 'includes/malina.php';?>
<?php include 'includes/footer.php'; ?>

deo coda

<div class="container">                     <div class="row">                       <div class="col-md-3">                           <h4><a href="#">Malina</a></h4>                            <img src="img/berba_malina.jpg" class="img-responsive img-thumbnail" alt="berba jagoda">                           <p><em>Cena:200din/kg</em></p>                           <?php require 'includes/malina.php';?>                           <hr>                        </div>                                                                   <div class="col-md-3">                             <h4><a href="#">Kupina</a></h4>                              <img src="img/berba_kupina.jpg" class="img-responsive img-thumbnail" alt="berba jagoda">                               <p><em>Cena:200 din/kg</em></p>                             <?php require 'includes/kupina.php';?>                                   <hr>                         </div>                           <div class="col-md-3">                                            <h4><a href="#">Visnja</a></h4>                                   <img src="img/berba_visanja.jpg" class="img-responsive img-thumbnail" alt="berba jagoda">                                   <p><em>Cena:200 din/kg</em></p>                                   <?php require 'includes/kupina.php';?>                                   <hr>                           </div>                            <div class="col-md-3">                               <h4><a href="#">Jagoda</a></h4>                                   <img src="img/berba_jagoda.jpg" class="img-responsive img-thumbnail" alt="berba jagoda">                                   <p><em>Cena:200 din/kg</em></p>                                   <?php require 'includes/kupina.php';?>                                   <hr>                            </div>                       </div>                     </div>
Rezultat







U malina.php se nalazi forma

 <div id="formular">                 <div class="container">                   <div class="row">                     <div class="col-md-12">                             <form method="post">                                <p>                                 <label for="voće">Voće:</label>                                 <select name="voće" id="voće">                                   <option value="malina" selected>Sveza malina</option>                                   <option value="smrznuta malina">Smrznuta malina</option>                                   <option value="sok od maline">Sok od maline</option>                                   <option value="dzem od malina">Dzem od malina</option>                                 </select>                               </p>                               <p>                                 <label form="quantity">kg:</label>                                   <input name="quantity" type="number" id="quantity" min="0" value="0">                               </p>                                                             <p>                                 <input type="submit" name="naruči" id="naruči" value="naruči">                                 <input type="hidden" name="cena" id="price" value="100">                               </p>                             </form>                     </div>                   </div>                 </div>               </div>
Npr da li mogu da se koriste nasa slova umesto dz da napisem dž kod option value, i da li moze da se napise i u option value (opciona vrednost) veliko slovo Dz ili mora malo slovo dz.
<option value="dzem od malina">Dzem od malina</option>

offline
  • Pridružio: 25 Mar 2015
  • Poruke: 548

Kako da podesim text na sredini carousela, probao sa padding i margin ali ne ide. Pozdrav
span { color:grey;     font-family: 'Oswald', sans-serif;     font-size: 50px }
<div class="carousel-inner" role="listbox">     <div class="item active">       <img src="img/1.jpg" alt="...">       <div class="carousel-caption">        <span><strong>Aktuelnosti u proizvodnji malina</strong>           </span>       </div>     </div>.....



Pronasao sam odgovor na pitanje ali kako da ga primenim probao ali nista?
.text-center{    text-align: center !important;   }  <p class="text-center">

.carousel-caption { text-align: center; }
.carousel-caption span { }

Ja sam postavio u html
 <div class="carousel-inner" role="listbox">         <div class="item active">           <img src="img/1.jpg" class="img-responsive" alt="...">           <div class="carousel-caption">            <span><strong><p class="text-center">Aktuelnosti u proizvodnji malina</p></strong>               </span>           </div>         </div>

dodao sam class="text-center" da bih podesio u css-u i dodao ovako

span {     color:grey;     font-family: 'Oswald', sans-serif;     font-size: 50px; } .carousel-caption { text-align: center; } .carousel-caption span { text-align: center; } .text-center{    text-align: center !important;   }

Ne radi

offline
  • m4rk0  Male
  • Administrator
  • Administrator tech foruma
  • Marko Vasić
  • Gladijator - Maximus Decimus Meridius
  • Pridružio: 14 Jan 2005
  • Poruke: 15766
  • Gde živiš: Majur (Colosseum)

Prvo proveri da li klasi .carousel-inner zadana relativna pozicija, ako nije zadaj je.


.carousel-inner {   position: relative; }

To radis da bi u odnosu na nju apsolutno pozicionirao natpis. A natpis apsolutno pozicioniras i centriras na sledeci nacin.

.carousel-caption {     left: 0;     position:absolute;     text-align:center;     top: 50%;     width: 100%; }

offline
  • Pridružio: 25 Mar 2015
  • Poruke: 548

m4rk0 ::Prvo proveri da li klasi .carousel-inner zadana relativna pozicija, ako nije zadaj je.


.carousel-inner {   position: relative; }

To radis da bi u odnosu na nju apsolutno pozicionirao natpis. A natpis apsolutno pozicioniras i centriras na sledeci nacin.

.carousel-caption {     left: 0;     position:absolute;     text-align:center;     top: 50%;     width: 100%; }



Radi, hvala, majstorski odreadjeno. Ovaj naslov koji ne odgovara velicini ekrana treba podesiti preko media queries da bi se prikazao naslov adekvatno velicini ekrana posto je slider responsiv da li je tako?





Ko je trenutno na forumu
 

Ukupno su 1130 korisnika na forumu :: 27 registrovanih, 2 sakrivenih i 1101 gosta   ::   [ Administrator ] [ Supermoderator ] [ Moderator ] :: Detaljnije

Najviše korisnika na forumu ikad bilo je 3466 - dana 01 Jun 2021 17:07

Korisnici koji su trenutno na forumu:
Korisnici trenutno na forumu: bokisha253, Boris90, BORUTUS, cenejac111, CikaKURE, FileFinder, GandorCC, helen1, hyla, Još malo pa deda, Kruger, Mi lao shu, milutin134, Mixelotti, nesa1962, ostoja, Panter, Pikac-47, shone34, Srki94, Srle993, taz1cl, Toper, vathra, vukovi, yrraf, 79693