Centar za edukaciju-BiH


switch Lista naslova:

#1 09.09.2020-19:30
zxz Offline
Administrator
Registrovan/a od: 03.02.2009-16:22
Komentari: 10,255


Subject: CSS trikovi*
Samo neke interesantne stvari koje se ticu CSS-a.
Pitanja ce biti izbriana
Pozdrav
Ovaj komentar je mijenjan 1 puta. zadnja izmjena 09.09.2020-19:31 od strane zxz. ↑  ↓

#2 09.09.2020-19:42
zxz Offline
Administrator
Registrovan/a od: 03.02.2009-16:22
Komentari: 10,255


Subject: Prvi red (pseudo element)
Property prvog reda teksta.
DownloadIzvorni kod (Text):
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <style>
  5. p::first-line {
  6.   color: red;
  7.   font-size: 30px;
  8. }
  9. </style>
  10. </head>
  11. <body>
  12.  
  13. <p>Otvaranje tema – Prije no što otvorite temu pokušajte putem pretrage nai odgovor koji tražite ili pak sli
  14. nu temu koju želite da otvorite.Ukoliko ne postoji sli
  15. na tema ili odgovor na vaše pitanje otvorite novu temu. Teme otvarajte na podforumima na koje tematski pripadaju. Uvodni post je obavezan jer njime objašnjavate razlog pokretanja temea i njen cilj, kao i svoje mišljenje o temi. Teme koji tematski nemaju veze s podforumom na kojem se nalaze, biti e premještene na prikladne podforume. Nije dozvoljeno otvaranje tema kojima je cilj i svrha samo besmisleno nabijanje postova – primjer "Napišite nešto". Duple teme e se ukidati.
  16. Pokreta
  17.  tema ima pravo tražiti zatvaranje vlastite teme, editiranje naslova, premještanje teme - u svrhu održavanja rasprave ili spre
  18. avanja uništavanja teme. Klju
  19. anje i bacanje teme na molbu se nee provoditi ukoliko je pokreta
  20. u jedini cilj ometati i onemoguiti ostalima pisanje.
  21.  
  22. Naslovi – naslov mora zadovoljiti minimum dobrog ukusa i pismenosti, ina
  23. e se editira (osim ako se radi o namjernim greškama s nekom poentom) .Pokušajte nai maj prikladniji naziv za temu koju želite otvoriti tako da se iz naslova vidi o
  24. emu se radi. Diskutant pokreta
  25.  ima pravo tražiti od moderatora editiranje naslova teme koji je pokrenuo.
  26.  
  27. Personalizirane teme – dozvoljene su ako im svrha nije vrijeanje pojedinaca i iznošenje laži i zlonamjernih izmišljotina. Osoba o kojoj se radi ima pravo tražiti zatvaranje teme.
  28. Reklamiranje na temama – je zabranjeno. Tu spadaju i linkovi na vlastite internet stranice kojima reklamirate vlastite proizvode, usluge, tvrtku itd. Isto vrijedi i za teme o piramidalnim na
  29. inima zarade (npr. $pir) i sl.
  30.  
  31. Caps lock – pisanje cijelih re
  32. enica velikim slovima smatra se deranjem. Razmislite kada nešto naglašavate, a kada je to deranje.</p>
  33.  
  34. </body>
  35. </html>

Pozdrav
↑  ↓

#3 10.09.2020-18:55
zxz Offline
Administrator
Registrovan/a od: 03.02.2009-16:22
Komentari: 10,255


Subject: Velika i mala slova
Mislim da netreba dodatno objasnjenje.
DownloadIzvorni kod (Text):
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <style>
  5. p.velika {
  6.   text-transform: uppercase;
  7. }
  8.  
  9. p.mala {
  10.   text-transform: lowercase;
  11. }
  12.  
  13. p.prvo_veliko {
  14.   text-transform: capitalize;
  15. }
  16. </style>
  17. </head>
  18. <body>
  19.  
  20. <p class="velika">Sve velika slova.</p>
  21. <p class="mala">SVE MALA slova.</p>
  22. <p class="prvo_veliko">prvo veliko slovo.</p>
  23.  
  24. </body>
  25. </html>

Pozdrav
Ovaj komentar je mijenjan 1 puta. zadnja izmjena 10.09.2020-18:55 od strane zxz. ↑  ↓

#4 11.09.2020-08:11
zxz Offline
Administrator
Registrovan/a od: 03.02.2009-16:22
Komentari: 10,255


Subject: Razmak izmedju slova u tekstu
Sve je receno u naslovu,
DownloadIzvorni kod (Text):
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <style>
  5. h1{
  6.   word-spacing: 30px;
  7. }
  8.  
  9. h2.razmak_mali {
  10.   word-spacing: -8px;
  11. }
  12. </style>
  13. </head>
  14. <body>
  15.  
  16. <h1 >Ovo je tekst sa 30px</h1>
  17. <h2>Ovo je tekst sa -8px</h2>
  18.  
  19. </body>
  20. </html>

Pozdrav
↑  ↓

#5 11.09.2020-08:17
zxz Offline
Administrator
Registrovan/a od: 03.02.2009-16:22
Komentari: 10,255


Subject: Sjena na tekstu
Kao sto pise u naslvu, sjena na tekstu.
DownloadIzvorni kod (Text):
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <style>
  5. h1 {
  6.   text-shadow: 3px 3px #828381;
  7. }
  8. </style>
  9. </head>
  10. <body>
  11.  
  12. <h1>Sjena tna tekstu!</h1>
  13.  
  14. </body>
  15. </html>

Pozdrav
↑  ↓

#6 11.09.2020-08:29
zxz Offline
Administrator
Registrovan/a od: 03.02.2009-16:22
Komentari: 10,255


Subject: Tablica primjer
DownloadIzvorni kod (Text):
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <style>
  5. table {
  6.   border-collapse: collapse;
  7.   width: 100%;
  8. }
  9.  
  10. th, td {
  11.   text-align: left;
  12.   padding: 8px;
  13. }
  14.  
  15. tr:nth-child(even){background-color: #f2f2f2}
  16.  
  17. th {
  18.   background-color: #4CAF50;
  19.   color: white;
  20. }
  21. </style>
  22. </head>
  23. <body>
  24.  
  25. <h2>Primjer tablice</h2>
  26.  
  27. <table>
  28.   <tr>
  29.     <th>Ime</th>
  30.     <th>Prezime</th>
  31.     <th>Iznos</th>
  32.   </tr>
  33.   <tr>
  34.     <td>Petar</td>
  35.     <td>Petrovic</td>
  36.     <td>120 BAM</td>
  37.   </tr>
  38.   <tr>
  39.     <td>Niko</td>
  40.     <td>Neznanovic</td>
  41.     <td>150 BAM</td>
  42.   </tr>
  43.   <tr>
  44.     <td>Mujo</td>
  45.     <td>Mujic</td>
  46.     <td>350 BAM</td>
  47.   </tr>
  48.   <tr>
  49.     <td>Emir</td>
  50.     <td>Emirovic</td>
  51.     <td>200 BAM</td>
  52. </tr>
  53. </table>
  54.  
  55. </body>
  56. </html>

Pozdrav
↑  ↓

#7 11.09.2020-08:47
zxz Offline
Administrator
Registrovan/a od: 03.02.2009-16:22
Komentari: 10,255


Subject: Fiksna špozicja teksta
DownloadIzvorni kod (Text):
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <style>
  5. div.static {
  6.   position: fixed;
  7.   bottom: 0;
  8.   right: 0;
  9.   width: 300px;
  10.   border: 3px solid #73AD21;
  11. }
  12. </style>
  13. </head>
  14. <body>
  15.  
  16. <h2>Fiksirani tekst<a href=""><a href=""></a></a></h2>
  17.  
  18. <p>Naslovi – naslov mora zadovoljiti minimum dobrog ukusa i pismenosti, ina
  19. e se editira (osim ako se radi o namjernim greškama s nekom poentom) .Pokušajte nai maj prikladniji naziv za temu koju želite otvoriti tako da se iz naslova vidi o
  20. emu se radi. Diskutant pokreta
  21.  ima pravo tražiti od moderatora editiranje naslova teme koji je pokrenuo.</p>
  22.  
  23. <div class="static">
  24. Ovo bi mogla biti neka napomena ili upozorenje.
  25. </div>
  26.  
  27. </body>
  28. </html

Pozdrav
↑  ↓

#8 13.09.2020-21:46
zxz Offline
Administrator
Registrovan/a od: 03.02.2009-16:22
Komentari: 10,255


Subject: Slika u obliku elipse
DownloadIzvorni kod (Text):
  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  4. <style>
  5. html {
  6.     padding: 20px;
  7. }
  8.  
  9. .image {
  10.     width: 300px;
  11.     height: auto;
  12.     border-radius: 100%;
  13. }      
  14. </style>
  15. <img class="image" src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcQTzsFJHKDQSfvOM2eBV8a0DHMeQbWQsswlYw&usqp=CAU" />
  16. </body>
  17. </html>

Pozdrav
Ovaj komentar je mijenjan 2 puta. zadnja izmjena 13.09.2020-21:48 od strane zxz. ↑  ↓

#9 04.10.2020-23:43
zxz Offline
Administrator
Registrovan/a od: 03.02.2009-16:22
Komentari: 10,255


Subject: Tekst pod uglom
DownloadIzvorni kod (HTML):
  1. <!DOCTYPE HTML>
  2. <title>Number</title>
  3. <style type="text/css">
  4. article
  5. {
  6. background-color:gray;
  7. transform:rotate(-30deg);
  8. }
  9. </head>
  10. <article>
  11. ovo je tekst zakrenut za 30 stepeni
  12. </article>
  13. </body>
  14. </html>

Pozdrav
↑  ↓

#10 06.10.2020-21:13
zxz Offline
Administrator
Registrovan/a od: 03.02.2009-16:22
Komentari: 10,255


Subject: Transformacija teksta
DownloadIzvorni kod (HTML):
  1. <!DOCTYPE HTML>
  2. <title>Number</title>
  3. <style type="text/css">
  4. article
  5. {
  6. background-color:gray;
  7. transform: scale(1,3);
  8. }
  9. </head>
  10. <article>
  11. Ovo je tekst clanka... Ovo je tekst clanka... Ovo je tekst clanka... Ovo je tekst clanka...
  12. Ovo je tekst clanka... Ovo je tekst clanka...
  13. </article>
  14. </body>
  15. </html>

Pozdrav
↑  ↓

#11 07.10.2020-19:23
zxz Offline
Administrator
Registrovan/a od: 03.02.2009-16:22
Komentari: 10,255


Subject: Animacija
DownloadIzvorni kod (HTML):
  1. <!DOCTYPE>
  2. <style type="text/css">
  3. div
  4. {
  5. width:50px;
  6. height:50px;
  7. background:green;
  8. position:relative;
  9. animation:animacija 15s;
  10. }
  11. @keyframes animacija
  12. {
  13. 0% {background:green; left:2px; top:2px;}
  14. 25% {background:yellow; left:300px; top:2px;}
  15. 50% {background:blue; left:300px; top:300px;}
  16. 75% {background:green; left:2px; top:300px;}
  17. 100% {background:red; left:2px; top:2px;}
  18. }
  19. </head>
  20. <div></div>
  21. animacija
  22. </body>
  23. </html>

Pozdrav
↑  ↓

#12 17.10.2020-18:51
zxz Offline
Administrator
Registrovan/a od: 03.02.2009-16:22
Komentari: 10,255


Subject: Horizontalno poravnanje u sredinu
DownloadIzvorni kod (HTML):
  1. <!DOCTYPE html>
  2. .centar {
  3.   margin: auto;
  4.   width: 60%;
  5.   border: 3px solid #73AD21;
  6.   padding: 10px;
  7. }
  8. .sredina {
  9.   text-align: center;
  10.  
  11. }
  12. </head>
  13.  <div class="sredina">
  14. <h2>Poravnanje centar</h2>
  15. </div>
  16. <p>Horizontalno poravnanje u centar</p>
  17.  
  18. <div class="centar">
  19.   Ovo je poravnanje u centar
  20. </div>
  21.  
  22. </body>
  23. </html>

Pozdrav
↑  ↓

Stranice (1): 1


All times are GMT +01:00. Current time: 28.11.2020-02:12.