| layout | title | nav_order |
|---|---|---|
default |
Images |
3 |
View the source Markdown for this page
Add an image from the web:
Start an in-line link with an exclamation point then place the alt text in the brackets followed by the image link in the parentheses:
You can also add images "reference style." This is handy if you don't want to clutter up your Markdown or if you need to use an image more than once. You can just place the references at the bottom of the page. It goes like this:
![GOAT][Simone]
[Simone]: https://upload.wikimedia.org/wikipedia/commons/thumb/7/74/Simone_Biles_Rio_2016e.jpg/256px-Simone_Biles_Rio_2016e.jpg
Nice job!
Add an image from your directory:
You can also add images from a file directory. If you're using GitHub Pages, that means you would want a folder where your content or images live in your GitHub repository. But note that internal links from a "post" can be a little tricky. See the documentation.
Sweet!
Add a different format:
Want to put a gif in there? No problem!
"gif" is pronounced with a hard "g" {: .note}
Link an image:
To link an image, you just need to embed the image syntax within the syntax for a hyperlink:
Here's a regular link:
[CUB site](https://www.colorado.edu/)
Here's a linked image:
[](https://www.colorado.edu/)
Click Me!
So easy, right?!
Need to get extra fancy?
You can also add html directly to Markdown. Say you wanted to change the size of an image, for example.
<img src='content/img/mtn-dog.jpg' width='250' alt='Good Boy'>
