본문 바로가기
TIL: Today I Learned

[TIL] 20201101 HTML: The essentials (2)

by 김알리 2020. 11. 2.

HTML Boilerplate

  • HTML Skeleton = Boilerplate
  • Standardized markup that needs to go in every single html page
<!DOCTYPE html>
<html>
    <head>
       	<title> My First Page </title>
    </head>
    <body>
      	<!-- Content goes here-->
    </body>
</html>
  • <!DOCTYPE html>
    • Flag for the browser : "I'll use the lastest version of html."
    • No closing tag
  • <html>
    • Represents the root (top-level element) of an HTML document, so it is also referred to as the root element.
  • <head>
    • Document metadata element
    • Contains things that don't show up on the page.
  • <title>
    • What goes on the tap of the browser
  • <body>
    • Where the contents that show up on the page go.

 

 

List Element

  • <ol> : Ordered List (Numbered List)
  • <ul> : Unordered List (Bulleted List)
  • <li> : Used to represent a single item in a list

Numbered List (Ordered List)

<ol>
    <li> list1 </li>
    <li> list2 </li>
    <li> list3 </li>
</ol>

 

Bulleted List (Unordered List)

<ul>
    <li> list1 </li>
    <li> list2 </li>
    <li> list3 </li>
</ul>

 

 

 

Anchor Tags

  • Used to make hyperlinks
<a href="hyperlink"> I AM A LINK! </a>
  • A webpage should start with 'www' to be recognized as a webpage.
  • Can link to a local or shared file, i.e. html file in the same folder.

 

 

Images

  • Doesn't have a closing tag
<img src="source of the image"
     alt="descriptions of the image">
  • src
    • Local image
      • in the same folder with the html file : "image.jpg"
      • in another folder (location needed) : "images/cats/image.jpg"
    • online
      • URL from the website
  • alt 
    • Text description of the image
    • Screen readers can detect and read it. 

 

 

 

Comments

  • Notation, Ignored by browsers
<!-- Comments -->

 

 

 

* This post is a summary of Udemy Course "The Web Developer Bootcamp" by Colt Steele.