FANDOM


Formatowanie tekstu


Pogrubienie i kursywa

Na wiki masz dwie opcje jeżeli chodzi o tryb źródłowy:

  • Wikiowy kod

Na wiki do pochylenia i pogrubienia tekstu używa się apostrofów ' - obowiązuje tylko na wiki.

Tryb źródłowy Tryb wizualny
''Kursywa'' Kursywa
'''Pogrubienie''' Pogrubienie
'''''Kursywa i pogrubiona''''' Kursywa i pogrubiona

  • HTML

Inną opcją jest powszechnie znany kod HTML, który wikia również obsługuje.
Poza użyciem tagów zamiast apostrofów ta opcja niczym się nie różni od wikiowej.

Tryb źródłowy Tryb wizualny
<i>Kursywa</i> Kursywa
<b>Pogrubienie</b> Pogrubienie
<b><i>Kursywa i pogrubienie</i></b> Kursywa i pogrubiona

Kreślenie... (Linie)

Do tych czynności możemy użyć tagów "<u>", "<strike>" oraz "<span style="text-decoration:WYBRANA_OPCJA;">"

Tryb źródłowy Tryb wizualny
<u>Podkreślenie</u> Podkreślenie
<span style="text-decoration:underline">Podkreślenie</span> Podkreślenie
<strike>Przekreślenie</strike> Przekreślenie
<s>Przekreślenie</s> Przekreślenie
<span style="text-decoration:through;">Przekreślenie</span> Przekreślenie
<span style="text-decoration:overline">NAD</span> NAD TEKSTEM
<span style="text-decoration:underline overline line-through;">Kombinacja</span> Kombinacja

KOLORY

Kody kolorów możesz wyszukać na google(np. http://windows.home.pl/kolory.htm, http://paletakolorów.get3.eu/), możesz też wziąć je stąd: Pomoc:Kolory

Kolor czcionki (color)

<span style="color: KOLOR"> - dzięki temu dodanemu przed tekstem zakończonym tagiem </span> możesz zmienić kolor czcionki.

W miejscu KOLOR wklejasz kod lub nazwę koloru.

Wyróżniamy trzy typy uzyskania koloru:

  • poprzez wpisanie angielskiej nazwy np.lime
  • poprzez wklejenie szesnastkowego kodu RGB(Hex) np.#00FF00
  • poprzez wklejenie dziesiętnego kodu RGB np.0, 255, 0

Na przykładzie posłużymy się kolorem limonkowym.

Tryb źródłowy Tryb wizualny
<span style="color: lime">Angielska nazwa</span> Angielska nazwa
<span style="color: #00FF00">Hex</span> Hex
<span style="color: rgb(0, 255, 0)">RGB</span> RGB

W drugim przypadku ważne żeby kod był bez spacji i na początku miał #(kiedy tak nie jest należy kod zredukować - usunąć spacje i dodać #)
W trzecim przypadku ważne jest w miejsce KOLOR wstawić rgb po czym w nawiasie wypisać po przecinku odpowiednie liczby.


Przykłady innych kolorów:

Tryb źródłowy Tryb wizualny
<span style="color: DarkCyan">Angielska nazwa</span> Angielska nazwa
<span style="color: #4B0082">Hex</span> Hex
<span style="color: rgb(241, 52, 103)">RGB</span> RGB

Podświetlenie (background-color)

<span style="background-color:KOLOR;"> - jedyne czym się różni ten kod to to, że przed "color" jest dodane background-.
Poza tym zmienianie koloru wygląda tu tak samo jak w przypadku kolorowania czcionki.

Tryb źródłowy Tryb wizualny
<span style="background-color: DarkCyan">Angielska nazwa</span> Angielska nazwa
<span style="background-color: #4B0082">Hex</span> Hex
<span style="background-color: rgb(241, 52, 103)">RGB</span> RGB

Kolor tekstu i tła

Można złączyć oba te kody dzięki czemu możemy ustalić kolor czcionki i tła wokół niej:

Tryb źródłowy Tryb wizualny
<span style="background-color: DodgerBlue; color: #00008B">PRZYKŁAD 1</span> PRZYKŁAD 1
<span style="background-color: black; color: rgb(241, 52, 103)">PRZYKŁAD 2</span> PRZYKŁAD 2

Cień (text-shadow)

Cień tekstu... czy cień będzie pod czy za tekstem, to już zależy od ciebie.

Tag na cień tekstu wygląda mniej więcej tak: <span style="text-shadow:KOLOR 0 0 LICZBApx;">

  • W miejscu KOLOR ma być nazwa/kod wybranego koloru, wstawiony tam kolor będzie kolorem cienia.
  • W miejscu LICZBA musi być wartość wyrażona w pikselach. Liczba ta ma wpływ na rozmazanie cienia.
  • W tagu znalazły się dwa zera. Pozostawienie ich w takiej formie da nam efekt świecącego tekstu.
Tryb źródłowy Tryb wizualny
<span style="text-shadow:Yellow 0 0 5px;">PRZYKŁAD 1</span> PRZYKŁAD 1
<span style="text-shadow:Yellow 0 0 15px;">PRZYKŁAD 1</span> PRZYKŁAD 1


Zwiększenie wartości jednego z nich ma wpływ na położenie cienia.

<span style="text-shadow:KOLOR LICZBApx 0 0;">

  • Jeżeli zwiększymy wartość pierwszego zera objawi nam się cień-kopia tekstu po prawej, dalsze zwiększanie wartości w pikselach oddala cień od tekstu.
  • Jeżeli tę samą wartość wpiszemy na minusie, cień przesunie się w lewo.
Tryb źródłowy Tryb wizualny
<span style="text-shadow:DeepPink 2px 0 0;">PRZYKŁAD 2</span> PRZYKŁAD 2
<span style="text-shadow:DeepPink -2px 0 0;">PRZYKŁAD 3</span> PRZYKŁAD 3


<span style="text-shadow:KOLOR 0 LICZBApx 0;">

  • Zwiększenie wartosci drugiego zera ma niemalże identyczny efekt jak z było to z pierwszym. Jedyną różnicą jest to, że tekst przesuwa się w dół lub w górę(kiedy wpiszesz minusową wartość).
Tryb źródłowy Tryb wizualny
<span style="text-shadow:DeepPink 0 3px 0;">PRZYKŁAD 4</span> PRZYKŁAD 4
<span style="text-shadow:DeepPink 0 -3px 0;">PRZYKŁAD 5</span> PRZYKŁAD 5


<span style="text-shadow:KOLOR LICZBApx LICZBApx 0;">

  • Kombinowanie z pierwszą i drugą wartością spowoduje przesuwanie się cienia na skos.
Tryb źródłowy Tryb wizualny
<span style="text-shadow:DeepPink 2px 2px 0;">PRZYKŁAD 6</span> PRZYKŁAD 6
<span style="text-shadow:DeepPink -3px -3px 0;">PRZYKŁAD 7</span> PRZYKŁAD 7

Kombinacja - najczęściej używana wersja cienia(text-shadow)

Najczęściej kiedy tworzysz cień tekstu wykorzystujesz do tego przynajmniej jedno z pierwszych dwóch zer i trzecie.
Nie daje nam to efektu święcącego tekstu jak w pierwszym przykładzie. Tutaj podświetlony zostaje cień-kopia tekstu.

Tryb źródłowy Tryb wizualny
<span style="text-shadow:Aqua 0 3px 5px;">PRZYKŁAD 1</span> PRZYKŁAD 1
<span style="text-shadow:Aqua 3px 0 5px;">PRZYKŁAD 2</span> PRZYKŁAD 2
<span style="text-shadow:Aqua 6px -7px 10px;">PRZYKŁAD 3</span> PRZYKŁAD 3
<span style="text-shadow:Aqua -4px 5px 10px;">PRZYKŁAD 4</span> PRZYKŁAD 4
Tryb źródłowy Tryb wizualny
<span style="color:Black; font-weight:Bold; text-shadow:Aqua 0 0 9px;">PRZYKŁAD #5</span> PRZYKŁAD #5
<span style="color:Yellow; text-shadow:LawnGreen 0 0 9px;">PRZYKŁAD #6</span> PRZYKŁAD #6

Zmiana czcionki

<span style="font-family:CZCIONKA"> - tak wygląda kod, który należy wpisać przed wyrazem, w tym przypadku wyraz należy zakończyć tagiem </span>
W miejsce CZCIONKA wpisujesz nazwę interesującej ciebie czcionki.
Rodzaje czcionek którymi dysponujesz na kompie możesz znaleźć m.in. w WordPadzie ;)

Tryb źródłowy Tryb wizualny
<span style="font-family:Georgia">PRZYKŁAD 1</span> PRZYKŁAD 1
<span style="font-family:comic sans ms">PRZYKŁAD 2</span> PRZYKlAD 2
<span style="font-family:Arial Black">PRZYKŁAD 3</span> PRZYKlAD 3

Rozmiar czcionki

Jak w większości przypadków użyjemy tutaj tagu <span style="">.
W cydzysłów tym razem wpiszemy font-size:ROZMIAR - gdzie zamiast słowa ROZMIAR jest wartość liczbowa wyrażona w punktach(pt) lub procentach(%)

1pt=10%
1%=0.1pt

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 Tryb wizualny
<span style="font-size:15pt">15 - powiększony w pt</span> 15 - powiększony w pt
<span style="font-size:150%">150 - powiększony w %</span> 150 - powiększony w %


Tryb źródłowy Tryb wizualny
<span style="font-size:100%">Oryginalny rozmiar</span> Oryginalny rozmiar
<span style="font-size:12pt">Powiększony</span> Powiększony
<span style="font-size:160%">Powiększony</span> Powiększony
<span style="font-size:8.5pt">Pomniejszony</span> Pomniejszony
<span style="font-size:68%">Pomniejszony</span> Pomniejszony

Kombinacje

Co zrobić kiedy potrzebujemy zmienionej czcionki, rozmiaru i koloru?
Wklejanie każdego kodu zajmuje dużo miejsca, do tego można się trochę pogubić kiedy trzeba wpisać odpowiednią ilość tagów końcowych...
Wszystko jest o wiele prostsze kiedy jest jeden tag początkowy i jeden tag końcowy, czyli niby jedna formułka... Nieprawda! Za pomocą jednego tagu można użyć wielu formułek.

Jedyne co muszą mieć wspólne wszystkie kody to tag, w tym przypadku <span style="">.
Da się zauważyć, że w każdej podanej formułce w tym artykule jest wykorzystany ten tag, każdy różni się tylko zawartością cudzysłowu.
To właśnie tam wpisujesz wszystko to co ci potrzeba.

JAK TO DZIAŁA?

Wybierasz zawartość cudzysłowu w danych formułkach i wklejasz je po kolei przedzielając nie przecinkiem, a średnikiem ;

Np. by zmienić czcionkę, jej wielkość i kolor w cudzysłów tagu "<span style="">" wklejasz(oddzielając średnikami) font-size:; font-family:; color:
Co pojawi się po dwukropku zależy od ciebie(zgodnie z objaśnieniami wyżej w artykule)

Wygląda to tak:

Tryb źródłowy Tryb wizualny
<span style="font-size:120%; font-family:Georgia; color:DeepPink">PRZYKŁAD</span> PRZYKŁAD

Jakich formułek użyjesz zależy od tego jakiego efektu potrzebujesz.

Inne przykłady możliwych kombinacji:

Tryb źródłowy Tryb wizualny
<span style="font-family:Roman; font-size:14pt">PRZYKLAD 2</span> PRZYKLAD 2
<span style="background-color: #990099; color: Lime">'''PRZYKLAD 3'''</span> PRZYKLAD 3
<span style="background-color: Indigo; font-size:82%">''PRZYKLAD 4''</span> PRZYKLAD 4
<span style="color: FireBrick; font-size:220%; font-family:Impact"><u>PRZYKLAD 5</u></span> PRZYKLAD 5
<span style="font-size:19pt; font-family:Serif; color: Silver"><strike>'''PRZYKLAD 6'''</strike></span> PRZYKLAD 6

Ad blocker interference detected!


Wikia is a free-to-use site that makes money from advertising. We have a modified experience for viewers using ad blockers

Wikia is not accessible if you’ve made further modifications. Remove the custom ad blocker rule(s) and the page will load as expected.

Więcej z Fandomu

Losowa wiki