Skip to content
  • There are no suggestions because the search field is empty.

Links and Basic HTML

IMPORTANT NOTE: If you copy text from this document to paste into another document, you'll want to paste it into the "Source Code" area (the button in the top left corner of the word processing controls that says "Source") of the new document:

LINKS

______________________________________________________________________

RELATIVE LINK (a link to a page on the same website) that opens in the same browser tab: <a href="(/page path)">display text</a>

EXAMPLE: <a href="/order-by-date/">Check Availability</a>

______________________________________________________________________

RELATIVE LINK (a link to a page on the same website) that opens in a new browser tab: <a href="(/page path)" target="_blank">display text</a>

EXAMPLE: <a href="/order-by-date/" target="_blank">Check Availability</a>

______________________________________________________________________

ABSOLUTE LINK (a link to a page on a different website) that opens in the same browser tab: <a href="(full URL)">display text</a>

EXAMPLE: <a href="https://cat-bounce.com/">Click here to see a bunch of cats</a>

______________________________________________________________________

ABSOLUTE LINK (a link to a page on a different website) that opens in a new browser tab: <a href="(full URL)" target="_blank">display text</a>

EXAMPLE: <a href="https://cat-bounce.com/" target="_blank">Click here to see a bunch of cats</a>

______________________________________________________________________

INLINE HTML TEXT FORMATTING (BOLD, ITALIC, ETC.)

______________________________________________________________________

BOLD TEXT: <b>display text</b>

EXAMPLE: <b>This text is bold</b>

______________________________________________________________________

ITALICIZED TEXT: <i>display text</i>

EXAMPLE: <i>This text is italicized</i>

______________________________________________________________________

HIGHLIGHTED TEXT: <mark>display text</mark>

EXAMPLE: <mark>This text is highlighted</mark>

______________________________________________________________________

UNDERLINED TEXT: <u>display text</u>

EXAMPLE: <u>This text is underlined</u>

______________________________________________________________________

MULTIPLE ATTRIBUTES: <b><i><mark><u>display text</u></mark></i></b>

EXAMPLE: <b><i><mark><u>This text is bold, italicized, highlighted, and underlined</u></mark></i></b>

______________________________________________________________________

STYLING (TEXT COLOR, SIZE, FONT, ETC.)

______________________________________________________________________

Font color: <span style="color:(hex or rgb color code***);">display text</span>

EXAMPLE: <span style="color:#800080;">#800080 is the hex code for purple, so this text is purple</span>

______________________________________________________________________

Font size: <span style="font-size:(desired text size in point [pt], pixels [px], percentage [%], ems [em], or rems [rem]);">display text</span>

EXAMPLE: <span style="font-size:16pt;">This is 16 point text</span>

______________________________________________________________________

Font family: <span style="font-family:(desired font family);">display text</span>

EXAMPLE: <span style="font-family:Times New Roman;">This is Times New Roman text</span>

______________________________________________________________________

Multiple styles: <span style="font-family:(desired font family); font-size:(desired text size); color:(hex or rgb color code);">display text</span>

EXAMPLE: <span style="font-family:Georgia; font-size:18pt, color:#00ffff;">This is 18 point cyan colored text in the Georgia font family</span>

______________________________________________________________________

***Search in the Knowledge Base using the keyword "hex" for a list of HTML color hex codes. You can find any other hex codes you might be looking for through a web search.

RESOURCES

W3 Schools: an online "school" that has tutorials for how to use HTML and CSS, with a practice interface

HTML Tutorial Start Page: https://www.w3schools.com/html/default.asp

CSS Tutorial Start Page: https://www.w3schools.com/css/default.asp

Stack Overflow: an online forum for web developers with articles and question and answer forums

https://stackoverflow.com/

Khan Academy: another online "school" with HTML and CSS tutorials

https://www.khanacademy.org/

Google and other search engines: I know it seems obvious, but I’ve had great success with WEB searches like "HTML link formatting" when I couldn’t remember something, or when I needed to learn something new. Oftentimes, W3 and Stack Overflow are among the top links. The internet is chock full of resources and knowledge; a little Googling can go a long way.