Bootstrap 3

1

Bootstrap 3

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

Pitanje kako postaviti dva efekta na jednu klasu fade efekat i thumbnail.



Registruj se da bi učestvovao u diskusiji. Registrovanim korisnicima se NE prikazuju reklame unutar poruka.
offline
  • m4rk0  Male
  • Administrator
  • Administrator tech foruma
  • Marko Vasić
  • Gladijator - Maximus Decimus Meridius
  • Pridružio: 14 Jan 2005
  • Poruke: 15766
  • Gde živiš: Majur (Colosseum)

za prva dva pitanja bi mi trebao link do tvoje stranice da pogledm sta je problem, ovako ne razumem sta si uradio

3. Kada dve ili vise klasa zelis da stavis za jedan element, sve pises pod jedan class argument. Znaci

<img  src="img/kolacodmalina1.jpg" alt="..." class="fadeefekat img-thumbnail nesto-trece">



offline
  • Rade Jekić
  • Pridružio: 05 Okt 2005
  • Poruke: 3005
  • Gde živiš: Valjevo

Bootstrap je samo framework - dakle, skup alata za prikaz stranica i njihovo stilizovanja. Čine ga:

html fajlovi - u kojima se nalazi "kostur" stranice, tj. raspored elemenata na njoj
css fajlovi - u kojima se nalaze definisana pravila za prikaz pomenutih html elemenata na stranici
js (javascript) fajlovi - koji definišu međusobnu interakciju elemenata koji čine html stranicu ili njihovu interakciju sa korisnikom koji posećuje stranicu.


Svi ovi "alati" su skupljeni u jednu celinu i autor ih je nazvao Bootstrap. Ovaj paket svoju popularnost stiče upravo primenom novih tehnologija (koje donose css3 i html5 kao standardi) i osnova je za laku izradu tzv responsive sajtova - koji su u stanju da prilagode svoj izgled različitim veličinama ekrana uređaja na kojima se prikazuju.

Dakle, nema potrebe da ovaj skup alata smatraš "svemirskom tehnologijom" niti da se plašiš istog. Sa osnovnim poznavanjem html-a i css-a moći ćeš da pratiš prilično detaljnu dokumentaciju koja je lako dosptupna (da ne pominjem i veoma kvalitetne YT video materijale).

Sad, ukratko - osnova svega je mreža (eng. grid). Nešto slično tabelama koje su se pre koristile (koje su još odavno responsive po samoj svojoj prirodi, ali to je tema za neku drugu priču Smile ). Dakle, zamisli da je stranica na kojoj radiš upotrebom ovog framework-a podeljena na kolone i redove. Ovde je bitan broj kolona - ako koristiš bootstrap, tvoja stranica je podeljena na maksimalno 12 kolona čija je širina određana u procentima i između kojih postoji određeni razmak. Dakle, uvek se koristi maksimum od 12 kolona. I na manjim ekranima - telefon/tablet - se prikazuje/koristi pomenutih 12 kolona maksimalno ali je njihova širina manja (zato je definisana u procentima). U css fajlu postoje pravila svrstana u klase koja definišu kako se sajt prikazuje na određenim veličinama ekrana, a oni su podeljeni na:


xs - exTra Small (telefon)
sm - SMall (tablet/netbook)
md - MeDium (laptop)
lg - LarGe (monitori/veliki ekrani)


col je oznaka za kolonu, a broj na kraju pokazuje koliko se kolona koristi. Sada je nadam se jasniji naziv klase col-sm-3


Dokumentacija navodi i sledeća pravila:

ako se ne navede klasa koja označava broj korišćenih kolona, koristi se podrazumevana vrednost a to je 12
broj kolona važi za navedenu veličinu ekrana i za ekrane koji su veći od navedene oznake. Dakle, pomenuta oznaka col-sm-3 podrazumeva da će se na ekranima srednje veličine (md - medium) koristiti 3 kolone, ali da to važi i za veće ekrane (ako pogledaš listu videćeš da se odnosi još samo na lg - Large)


U skladu sa ovim što sam naveo, pitanje za tebe. Na koje ekrane se odnosi klasa col-sm-2 i kakav će biti prikaz (koliko kolona će biti prikazano) na svakom navedenom tipu ekrana?

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

Gde ima neki alat za browser ili neki eksterni program za testiranje bootstrap sajta za mobilne telefone, tablete, laptope, pc.

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

Pitanje: Kako da se usklade fontovi <p>
Uskladjeno pitanje i postavljeno na ovom linku
http://jsfiddle.net/skde3odm/

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

Napisano: 14 Apr 2015 19:13

dejnik978 ::Gde ima neki alat za browser ili neki eksterni program za testiranje bootstrap sajta za mobilne telefone, tablete, laptope, pc. Hvala

http://www.mycity.rs/Web-dizajn/Testiranje-sajta_2.html#p1749254

Dopuna: 14 Apr 2015 19:16

dejnik978 ::Pitanje: Kako da se usklade fontovi <p>
Uskladjeno pitanje i postavljeno na ovom linku
http://jsfiddle.net/skde3odm/


U kom smislu da uskladis fontove ? Ako zelis da ih smanjis na manjim rezolucijama, to se radi preko @media querija.

na pr velicina fonta paragrafa ti je 16px, a zelis da ga smanjis na xs rezolucijama, ti ces uraditi ovako

@media (max-width: 767px) {    p {font-size:14px;} }

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

Napisano: 14 Apr 2015 22:36

Ovo @media ne znam. Mozda nisam dobro to odradio. Ovaj link ne radi https://chrome.google.com/webstore/detail/window-resizer/

Dopuna: 14 Apr 2015 22:40

Imam pitanje na internet exploreru 9 ne radi odmah javascript nego trazi odobrenje, ako neko pogleda sajt sa jquery efektima i ne odobri javascript, onda nista od lepog sajta. Kako da to resim. Ovi efekti super rade na Opera 28.0, Chrome Version 41.0.2272.118 m. Sajt se vezba, radi u bootstrapu.

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

evo ispravnog linka: https://chrome.google.com/webstore/detail/window-r.....ilcgefonfh

I nauci @media querije , jer to je srz responsive dizajna.

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

1.Interesuje me vase misljenje o upotrebi fontova na bootstrap-u, kako je pravilnije. Ja koristim google fonts
npr ovako u css-u
@import url(http://fonts.googleapis.com/css?family=Open+Sans);  i gde hocu npr .h2 {font-family: 'Open Sans', sans-serif;}
Ovde imam problem da mi nisu isti fontovi na svim pregledacima. Neko resenje?

Vidim da koriste i kao
<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>

ili da fajlove vuku iz foldera

2. Drugo pitanje za sta sluze fontovi ili sta vec iz bootstrap skinutog foldera?
glyphicons-halflings-regular.eot glyphicons-halflings-regular.svg glyphicons-halflings-regular.ttf glyphicons-halflings-regular.woff glyphicons-halflings-regular.woff2

i na ovoj adresu podrska.
http://www.w3schools.com/cssref/css3_pr_font-face_rule.asp

Koje fontove koristiti, ili kao sto ih ja koristim na @import

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

1. Pravilni su svi navedeni nacini s tim sto uvek treba ici na opciju upotrebe google fontova kad god ej to moguce (zbog brzine ucitavanja fontova ; google server je brzi od svakog vaseg servera), a lokalno importovati samo u slucaju da se isti ne prikazuju kako treba (ja sam na pr imao problem sa Lato fontom ucitanim sa google servera koji klijenti nisu mogli da vide dok nisam lokalno importovao).

2. Bootstrap ima opciju prikaza prostih (jednobojnih) "slicica" u obliku fontova sto za prednost ima mogucnost izmene njihove boje kao i velicine bez ikakvog gubitka kvaliteta. Ti fajlovi koje si naveo su neophodni kako bi mogao normalno da koristis te tzv glyphicons.

http://getbootstrap.com/components/#glyphicons

Ko je trenutno na forumu
 

Ukupno su 558 korisnika na forumu :: 5 registrovanih, 3 sakrivenih i 550 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: babaroga, Istman, Koridor, laurusri, zziko