Je艣li znasz spos贸b tworzenia odno艣nik贸w, mo偶esz r贸wnie偶 dodawa膰 obrazy. Sk艂adnia jest niemal identyczna.
Obrazy r贸wnie偶 maj膮 dwie opcje wstawienia, podobnie jak odno艣niki, i
oba s膮 renderowane w ten sam spos贸b. R贸偶nica mi臋dzy odno艣nikami a obrazami
polega na tym, 偶e obrazy poprzedzone s膮 wykrzyknikiem (!
).
Pierwszy styl obrazu nazywa si臋 inline image link. Aby utworzy膰
taki link, wpisz wykrzyknik (!
), umie艣膰 tekst alternatywny w
nawiasach kwadratowych ([ ]
), a nast臋pnie umie艣膰 odno艣nik w
nawiasach okr膮g艂ych (( )
). (Tekst alternatywny to fraza lub
zdanie opisuj膮ce obraz dla os贸b niewidomych.)
Na przyk艂ad, aby utworzy膰 inline image link do
https://octodex.github.com/images/bannekat.png, z tekstem alternatywnym
m贸wi膮cym "Benjamin Bannekat", nale偶y napisa膰 to w formacie Markdown:
![Benjamin Bannekat](https://octodex.github.com/images/bannekat.png)
.
W poni偶szym polu zamie艅 odno艣nik na obraz i wype艂nij nawiasy z tekstem alternatywnym, aby powiedzie膰 "Pi臋kny tygrys":
Cudownie!
Cho膰 nie jest konieczne dodawanie tekstu alternatywnego, sprawi to, 偶e Twoja tre艣膰 b臋dzie dost臋pna dla Twojej publiczno艣ci, w tym dla os贸b niewidomych, korzystaj膮cych z czytnik贸w ekranowych lub nieposiadaj膮cych szybkiego po艂膮czenia internetowego.
W przypadku obrazu referencyjnego b臋dziesz post臋powa膰 tak samo jak w
przypadku odno艣nika referencyjnego.
Poprzedzisz Markdown wykrzyknikiem, a nast臋pnie podasz dwa nawiasy
kwadratowe dla tekstu alternatywnego, a potem dwa kolejne dla znacznika
obrazu, tak jak tutaj: ![Ojciec za艂o偶yciel][Ojciec]
. Na
dole swojej strony Markdown zdefiniujesz obraz dla tego znacznika, jak
tutaj: [Ojciec]: http://octodex.github.com/images/founding-father.jpg
.
W poni偶szym polu zacz臋li艣my umieszcza膰 kilka obraz贸w referencyjnych;
musisz je uzupe艂ni膰, tak jak w poprzedniej lekcji. Nazwij pierwszy
tag referencyjny "Czarny" i umie艣膰 odno艣nik prowadz膮cy do
https://upload.wikimedia.org/wikipedia/commons/a/a3/81_INF_DIV_SSI.jpg
;
drugi obrazowy odno艣nik prowadzi do http://icons.iconarchive.com/icons/google/noto-emoji-animals-nature/256/22221-cat-icon.png
.