Centar za edukaciju-BiH


switch Lista naslova: CSS trikovi

#1 09.09.2020 19:30
zxz Van mreze
Administrator
Registrovan od:03.02.2009
Postovi:10,644


Predmet:CSS trikovi
Samo neke interesantne stvari koje se ticu CSS-a.
Pitanja ce biti izbriana
Podrska samo putem foruma, jer samo tako i ostali imaju koristi od toga.
Ovaj post je ureden 2 puta. Posljednja izmjena 13.10.2021 22:11 od strane zxz. ↑  ↓

#2 09.09.2020 19:42
zxz Van mreze
Administrator
Registrovan od:03.02.2009
Postovi:10,644


Predmet:Prvi red (pseudo element)
Property prvog reda teksta.
PreuzmiIzvorni kôd (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>

Podrska samo putem foruma, jer samo tako i ostali imaju koristi od toga.
↑  ↓

#3 10.09.2020 18:55
zxz Van mreze
Administrator
Registrovan od:03.02.2009
Postovi:10,644


Predmet:Velika i mala slova
Mislim da netreba dodatno objasnjenje.
PreuzmiIzvorni kôd (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>

Podrska samo putem foruma, jer samo tako i ostali imaju koristi od toga.
Ovaj post je ureden 1 puta. Posljednja izmjena 10.09.2020 18:55 od strane zxz. ↑  ↓

#4 11.09.2020 08:11
zxz Van mreze
Administrator
Registrovan od:03.02.2009
Postovi:10,644


Predmet:Razmak izmedju slova u tekstu
Sve je receno u naslovu,
PreuzmiIzvorni kôd (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>

Podrska samo putem foruma, jer samo tako i ostali imaju koristi od toga.
↑  ↓

#5 11.09.2020 08:17
zxz Van mreze
Administrator
Registrovan od:03.02.2009
Postovi:10,644


Predmet:Sjena na tekstu
Kao sto pise u naslvu, sjena na tekstu.
PreuzmiIzvorni kôd (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>

Podrska samo putem foruma, jer samo tako i ostali imaju koristi od toga.
↑  ↓

#6 11.09.2020 08:29
zxz Van mreze
Administrator
Registrovan od:03.02.2009
Postovi:10,644


Predmet:Tablica primjer
PreuzmiIzvorni kôd (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>

Podrska samo putem foruma, jer samo tako i ostali imaju koristi od toga.
↑  ↓

#7 11.09.2020 08:47
zxz Van mreze
Administrator
Registrovan od:03.02.2009
Postovi:10,644


Predmet:Fiksna Å¡pozicja teksta
PreuzmiIzvorni kôd (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

Podrska samo putem foruma, jer samo tako i ostali imaju koristi od toga.
↑  ↓

#8 13.09.2020 21:46
zxz Van mreze
Administrator
Registrovan od:03.02.2009
Postovi:10,644


Predmet:Slika u obliku elipse
PreuzmiIzvorni kôd (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>

Podrska samo putem foruma, jer samo tako i ostali imaju koristi od toga.
Ovaj post je ureden 2 puta. Posljednja izmjena 13.09.2020 21:48 od strane zxz. ↑  ↓

#9 04.10.2020 23:43
zxz Van mreze
Administrator
Registrovan od:03.02.2009
Postovi:10,644


Predmet:Tekst pod uglom
PreuzmiIzvorni kôd (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>

Podrska samo putem foruma, jer samo tako i ostali imaju koristi od toga.
↑  ↓

#10 06.10.2020 21:13
zxz Van mreze
Administrator
Registrovan od:03.02.2009
Postovi:10,644


Predmet:Transformacija teksta
PreuzmiIzvorni kôd (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>

Podrska samo putem foruma, jer samo tako i ostali imaju koristi od toga.
↑  ↓

Stranice (2):1,2


Sva vremena su GMT +01:00. Trenutno vrijeme: 8: 48 pm.