| Formatowanie tekstu |
|---|
Jeśli chodzi o małe wikitekstowe triki to opierałam się na tym: Wikitekst - ściągawka. HTML z głowy i własnego doświadczenia.
Uwagi
1. Ciąg kresek ( -------- ) oznacza, że nie ma w danym kodzie sposobu na osiągnięcie danego celu, bądź ja go nie znam.
2. Przy stosowaniu kombinacji w tekście nie jest ważna kolejność dodawania bloków kodu, jednak ważna jest kolejność ich zamykania. Na przykład, jeśli chcesz osiągnąć TAKI EFEKT, możesz go osiągnąć na dwa sposoby:
<s><b>Pogrubienie</b></s> lub
<b><s>Pogrubienie</s></b>
Jednak proszę nie stosować zapisów takich jak <b><s>Pogrubienie</b></s>, gdyż może to i działa, jednak na dłuższą metę robi zamęt w kodzie, co utrudnia pracę innym i może powodować w przyszłości problemy z tekstem.
Kursywa, pogrubienie, kreślenie
| Tryb źródłowy Wiki Kod | Tryb źródłowy HTML | Tryb wizualny |
|---|---|---|
| ''Kursywa'' | <i>Kursywa</i> | Kursywa |
| '''Pogrubienie''' | <b>Pogrubienie</b> | Pogrubienie |
| '''''Kursywa i pogrubiona''''' | <i><b>Kursywa i pogrubienie</b></i> | Kursywa i pogrubienie |
| -------- | <u>Podkreślenie</u> | Podkreślenie |
| -------- | <span style="text-decoration:overline">Nad tekstem</span> | Nad tekstem |
| -------- | <s>Przekreślenie</s> |
Czcionka
Rodzaj czcionki
<span style="font-family:NAZWA"> - tak wygląda kod, który należy wpisać przed wyrazem, w tym przypadku wyraz należy zakończyć tagiem
- W miejsce NAZWA wpisujesz nazwę wybranej przez ciebie czcionki.
- Rodzaje czcionek którymi dysponujesz na kompie możesz znaleźć np. w WordPadzie.
! Pamiętaj jednak, że jeśli masz zainstalowane u siebie jakieś inne niż podstawowe czcionki i chcesz ich użyć, ty będziesz ją widział na stronie, lecz osoby które jej na komputerze nie mają już nie.
| Tryb źródłowy Wiki Kod | Tryb źródłowy HTML | Tryb wizualny |
|---|---|---|
| -------- | <span style="font-family:comic sans ms">Pizza!!!</span> | |
| -------- | <span style="font-family:Nyala">Pizza!!!</span> |
Rozmiar czcionki
Jak wcześniej użyjemy span
, aby więcej nie mieszać.
<span style="font-size:ROZMIAR">
- W polu, gdzie widzimy ROZMIAR, zamiast tego wstawiamy wartość liczbowa wielkości czcionki, która może być wyrażona w punktach(pt) lub procentach(%)
10pt=100% - oryginalny rozmiar, niższe wartości zmniejszają czcionkę, wyższe - zwiększają.
- Należy również pamiętać, że wielkość czcionki zależy również od jej rodzaju.
| Tryb źródłowy Wiki Kod | Tryb źródłowy HTML | Tryb wizualny |
|---|---|---|
| -------- | <span style="font-size:13pt">powiększony do 13pt</span> | powiększony do 13pt |
| -------- | <span style="font-size:80%">pomniejszony do 80%</span> | pomniejszony do 80% |
Lub można po prostu użyć:
| Tryb źródłowy Wiki Kod | Tryb źródłowy HTML | Tryb wizualny |
|---|---|---|
| -------- | <small>pomniejszona</small> | pomniejszona |
| -------- | <big>powiększona</big> | powiększona |
Kolor, cień czcionki
Tutaj również użyjemy span
.
<span style="color: KOLOR">
- W polu, gdzie widzimy KOLOR, zamiast tego wstawiamy kod lub nazwę koloru
Wyróżniamy trzy typy uzyskania koloru:
- poprzez wpisanie angielskiej nazwy np. red
- poprzez wklejenie szesnastkowego kodu RGB(Hex) np. #ff0000
- poprzez wklejenie dziesiętnego kodu RGB np. rgb(255,0,0)
| Tryb źródłowy Wiki Kod | Tryb źródłowy HTML | Tryb wizualny |
|---|---|---|
| -------- | <span style="color: red">Czerwony - red</span> | Czerwony - red |
| -------- | <span style="color: rgb(0,0,255)">Niebieski RGB</span> | Niebieski RGB |
| -------- | <span style="color: #ffff00">Żółty Hex</span> | Żółty Hex |
Wybór stylu pisania kolorów jest dowolny i należy do ciebie. Którego użyjesz, będzie działać. Jeśli napiszesz rgb(0,0,255) czy blue czy też #0000ff, to i tak będzie ten sam kolor.
Tło, cienie
| Tryb źródłowy Wiki Kod | Tryb źródłowy HTML | Tryb wizualny |
|---|---|---|
| -------- | <span style="background-color: Cyan">Tło Cyjanowe</span> | Tło Cyjanowe |
| -------- | <span style="text-shadow:Yellow 0 0 15px;">Żółty rozmazany cień</span> | Żółty rozmazany cień |
| -------- | <span style="text-shadow:Red 2px 0 0;">Czerwony przesunięty w prawo o 2px</span> | Czerwony przesunięty w prawo o 2px |
| -------- | <span style="text-shadow:Red -2px 0 0;">Czerwony przesunięty w lewo o 2px</span> | Czerwony przesunięty w lewo 0 2px |
| -------- | <span style="text-shadow:Green 0 -2px 0;">Zielony przesunięty w górę 0 2px</span> | Zielony przesunięty w górę o 2px |
| -------- | <span style="text-shadow:Green 0 2px 0;">Zielony przesunięty w dół o 2px</span> | Zielony przesunięty w dół o 2px |
| -------- | <span style="text-shadow:Blue -3px 2px 10px;">niebieski rozmazany, przesunięty w dół o 2px i lewo o 3px </span> | niebieski rozmazany, przesunięty w dół o 2px i lewo o 3px |
Kombinacje, łączenia
Wszystkie przedstawione powyżej komendy do formatowania tekstu można łączyć. Użycie jedynie span było zaplanowane, gdyż w ten sposób kod jest krótszy, gdyż wszystkie jego argumenty można umieścić za jednym style="".
Poniżej kilka przykładów:
| Tryb źródłowy | Tryb wizualny |
|---|---|
| <span style="background-color: Green; color: #ffff00"><s>PRZYKLAD 1</s></span> | |
| <u><span style="color: rgb(255,0,0); font-size:200%; font-family:Impact; text-shadow:Yellow 0 0 15px">PRZYKLAD 2</span></u> | PRZYKLAD 2 |
| <span style="font-family:Nyala; font-size:17pt">'''PRZYKLAD 3'''</span> | PRZYKLAD 3 |
| <small><span style="font-family:Roman;color: Strong green; font-size:14pt">PRZYKLAD 4</span></small> | PRZYKLAD 4 |