Centar za edukaciju-BiH


switch Lista naslova: CSS Primjeri
Stranice (4):1,2,3,4

#21 25.02.2015 18:31
zxz Van mreze
Administrator
Registrovan od:03.02.2009
Postovi:10,611


Predmet:first-line
Ovaj pseudo element vazi samo za prvu liniju teksta.
PreuzmiIzvorni kôd (HTML):
  1. p::first-line {
  2.     color: #0000FF;
  3.     font-variant: small-caps;
  4. }
  5. p.samovelika{
  6. font-variant: small-caps;
  7. }
  8. <TITLE>Title of your page</TITLE>
  9. </HEAD>
  10. <p>Ovdje ce prvi red biti ispisan velikim slovima i plavom bojom dok ce iduci redovi ispod prvog reda biti obicni odnosno nece potpadatai pod postavke u klasi p. Ovo je dobro kada hocemo nesto naglasiti ili napisati kao naslov.Ukoliko vam je veliki monitor mozda i ne viditi ucinak ako cio tekst stane u jedan red. Onda smanjite velicinu prozora vseg brovsera da bi vidjeli ucinak ovoga.</p>
  11. <p class="samovelika">Ovo ce bir samo velika slova bez boje i biti ce i nakon preloma teksta</p>
  12. </BODY>
  13. </HTML>

Podrška samo putem foruma, jer samo tako i ostali imaju koristi od toga.
↑  ↓

#22 25.02.2015 18:41
zxz Van mreze
Administrator
Registrovan od:03.02.2009
Postovi:10,611


Predmet:First-letter
Odnosi se samo na prvi karakter u tekstu.
PreuzmiIzvorni kôd (HTML):
  1. p::first-letter {
  2.     color: #FF00FF;
  3.     font-size: "25";
  4. }
  5. <TITLE>Prvi znak u tekstu</TITLE>
  6. </HEAD>
  7.  
  8. <p>Ucinak se vidi samo na prvom karakteru u tekstu.</p>
  9. </BODY>
  10. </HTML>

Podrška samo putem foruma, jer samo tako i ostali imaju koristi od toga.
↑  ↓

#23 26.02.2015 20:35
zxz Van mreze
Administrator
Registrovan od:03.02.2009
Postovi:10,611


Predmet:Gradients
PreuzmiIzvorni kôd (HTML):
  1. #grad {
  2.     height: 100px;
  3.     background: -webkit-linear-gradient(0deg, green, blue);
  4.     background: -o-linear-gradient(0deg, green, blue);
  5.     background: -moz-linear-gradient(0deg, green, blue);
  6.     background: linear-gradient(0deg, green, blue);
  7. }
  8. <TITLE>Gradisents</TITLE>
  9. </HEAD>
  10. <div id="grad" style="color:white;text-align:center;">Ovdje moze biti i neki tekst</div><br>
  11. <p><strong>Napomena:</strong><br>Ne podrzavaju verzije internet explorera nize od 9.</p>
  12. </BODY>
  13. </HTML>

Podrška samo putem foruma, jer samo tako i ostali imaju koristi od toga.
↑  ↓

#24 27.02.2015 09:03
zxz Van mreze
Administrator
Registrovan od:03.02.2009
Postovi:10,611


Predmet:text-shadow
PreuzmiIzvorni kôd (HTML):
  1. h1 {
  2.     text-shadow: 4px 4px 4px #FF00FF
  3. }
  4. <TITLE>Tekst Shadow</TITLE>
  5. </HEAD>
  6.  <h1>Ovo je tekst Shadow</h1>
  7.  <p><b>Note:</b><br> Ne podrzavaju verzije internet explorera nize od 9./p>
  8. </BODY>
  9. </HTML>

Podrška samo putem foruma, jer samo tako i ostali imaju koristi od toga.
↑  ↓

#25 28.02.2015 11:32
zxz Van mreze
Administrator
Registrovan od:03.02.2009
Postovi:10,611


Predmet:font-family
PreuzmiIzvorni kôd (HTML):
  1. p.roman {
  2.     font-family: "Times New Roman", Times, serif;
  3. }
  4. p.serif {
  5.     font-family: Arial, Helvetica, sans-serif;
  6. }
  7. <TITLE>Font</TITLE>
  8. </HEAD>
  9. <p class="roman">Ovo je font Times New Roman.</p>
  10. <p class="serif">Ovo je  Arial font.</p>
  11. </BODY>
  12. </HTML>

Podrška samo putem foruma, jer samo tako i ostali imaju koristi od toga.
↑  ↓

#26 28.02.2015 12:55
zxz Van mreze
Administrator
Registrovan od:03.02.2009
Postovi:10,611


Predmet:Font-stil
PreuzmiIzvorni kôd (HTML):
  1. p.normal {
  2.     font-style: normal;
  3. }
  4. p.italic {
  5.     font-style: italic;
  6. }
  7. p.oblique {
  8.     font-style: oblique;
  9. }
  10. <TITLE>Font stil</TITLE>
  11. </HEAD>
  12. <p class="normal">Normal klas stil.</p>
  13. <p class="italic">Italik klas stil.</p>
  14. <p class="oblique">Oblique klas stil.</p>
  15. </BODY>
  16. </HTML>

Podrška samo putem foruma, jer samo tako i ostali imaju koristi od toga.
↑  ↓

#27 01.03.2015 09:12
zxz Van mreze
Administrator
Registrovan od:03.02.2009
Postovi:10,611


Predmet:Transform rotate
PreuzmiIzvorni kôd (HTML):
  1. div {
  2.     width: 100px;
  3.     height: 100px;
  4.     background-color: red;
  5.     /* Rotate div */
  6.     -ms-transform: rotate(45deg); /* IE 9 */
  7.     -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
  8.     transform: rotate(45deg); /* Standardna syntaksa */
  9. }
  10. <TITLE>Transform</TITLE>
  11. </HEAD>
  12. <div>iCentar</div>
  13. </BODY>
  14. </HTML>

Podrška samo putem foruma, jer samo tako i ostali imaju koristi od toga.
↑  ↓

#28 01.03.2015 09:17
zxz Van mreze
Administrator
Registrovan od:03.02.2009
Postovi:10,611


Predmet:Transform-Translate
PreuzmiIzvorni kôd (HTML):
  1. div{
  2.     width: 200px;
  3.     height: 125px;
  4.     background-color: red;
  5.     border: 1px solid black;
  6.     -ms-transform: translate(450px,200px); /* IE 9 */
  7.     -webkit-transform: translate(450px,200px); /* Chrome, Safari, Opera */
  8.     transform: translate(450px,200px); /* Standarda syntaksa */
  9. }
  10. <TITLE>Transform</TITLE>
  11. </HEAD>
  12. <div>iCentar</div>
  13. </BODY>
  14. </HTML>

Podrška samo putem foruma, jer samo tako i ostali imaju koristi od toga.
↑  ↓

#29 02.03.2015 10:03
zxz Van mreze
Administrator
Registrovan od:03.02.2009
Postovi:10,611


Predmet:Transform-Scalse
PreuzmiIzvorni kôd (HTML):
  1. div {
  2.     width: 90px;
  3.     height: 70px;
  4.     background-color: green;
  5.     border: 1px solid black;
  6. }
  7. div#div1 {
  8.     margin: 100px;
  9.     -ms-transform: scale(1,3); /* IE 9 */
  10.     -webkit-transform: scale(1,3); /* Chrome, Safari, Opera */
  11.     transform: scale(1,3); /* Standardna sintaksa */
  12. }
  13. <TITLE>Transform scale</TITLE>
  14. </HEAD>
  15. <div>Ovo je div element</div>
  16. <div id="div1">Ovo je div1 element</div>
  17. </BODY>
  18. </HTML>

Podrška samo putem foruma, jer samo tako i ostali imaju koristi od toga.
↑  ↓

#30 03.03.2015 20:27
zxz Van mreze
Administrator
Registrovan od:03.02.2009
Postovi:10,611


Predmet:Tekst u kolonama-column-count
PreuzmiIzvorni kôd (HTML):
  1. .kolone {
  2.     -webkit-column-count: 4; /* Chrome, Safari, Opera */
  3.     -moz-column-count: 4; /* Firefox */
  4.     column-count: 4;
  5. }
  6. <TITLE>Kolone</TITLE>
  7. </HEAD>
  8. <div class="kolone">Izgleda nevjerojatno da su Egipani izgradili metropolu tako
  9. veli
  10. anstvene arhitekture kao Å¡to je piramida, u pustinjskom
  11. podru
  12. ju naizgled negostoljubivom prema životu i
  13. nesposobnom za pružanje prikladnog okoliša razvoju jedne
  14. civilizacije. To izvanredno postignue poslužilo je egiptologu
  15. Kurtu Mendelsohnu kao potvrda njegove teorije o tome da
  16. se gradnja piramida razvila kao vrsta civilne službe, u
  17. nastojanju da se sprije
  18. i nezaposlenost i povea blagostanje
  19. u Egiptu.
  20. Mendelsohn pretpostavlja da je administracija u drevnom
  21. Egiptu, vjerujui u potrebu stvaranja više državno
  22. orijentiranog naroda, prisilila religiju i obredne tradicije
  23. utjelovljene u filozofiji piramide da ustupe vodee mjesto
  24. njihovim društveno-ekonomskim planovima.
  25. Takvo moderno vienje drevne i visokorazvijene civilizacije
  26. u najboljem je slu
  27. aju postavka koja se može primijeniti na
  28. piramide iz mnogo kasnijeg razdoblja propadanja Egipta.
  29. Društveno-ekonomska teorija povijesti,
  30. ovjekovih
  31. nastojanja i djelovanja, teško je održiva
  32. ak i kada se primijeni
  33. na moderno doba, a kamoli tek na civilizacije nadahnute </div>
  34. </BODY>
  35. </HTML>

Podrška samo putem foruma, jer samo tako i ostali imaju koristi od toga.
↑  ↓

Stranice (4):1,2,3,4


Sva vremena su GMT +01:00. Trenutno vrijeme: 3: 49 pm.