HTML 002| HTML Document Standards

!DOCTYPE html & html & head & title tag

• !DOCTYPE html, the declaration specifying the version of HTML for the browser

• The html tags that enclose all of your HTML code
  

• The head tag that contains the metadata of a webpage, such as its title

a tag

• You can add links to a web page by adding an anchor element a and including the text of the link in between the opening and closing tags.
  
  
• The anchor element in the example above is incomplete without the href attribute. This attribute stands for hyperlink reference and is used to link to a path, or the address to where a file is located (whether it is on your computer or another location). The paths provided to the href attribute are often URLs.

<a href="https://www.wikipedia.org/">
  This Is A Link To Wikipedia</a>

target tag

• 새 창에서 하이퍼링크건 페이지 열리게 해줌
• The target attribute specifies how a link should open.
  
• For a link to open in a new window, the target attribute requires a value of _blank. The target attribute can be added directly to the opening tag of the anchor element, just like the href attribute.
• In the example above, setting the target attribute to "_blank" instructs the browser to open the relevant Wikipedia page in a new window.

<a href="https://en.wikipedia.org/wiki/Brown_bear" target="_blank">
  The Brown Bear</a>

Linking to Relative Page

<a href="./contact.html">Contact</a>

• 예시처럼 생성하면 콘택트라는 글자를 누르면 콘택트.html 페이지로 이동된다
  
  

글자 외의 것에 링크 걸기도 가능

(1) Text-only links

<a href="https://en.wikipedia.org/wiki/Opuntia" target="_blank">Prickly Pear</a>

(2) img links

<a href="https://en.wikipedia.org/wiki/Opuntia" 
 target="_blank">
<img src="https://www.Prickly_Pear_Closeup.jpg" 
     alt="A red prickly pear fruit"/><
/a>

Linking to Same Page

• In order to link to a target on the same page, we must give the target an id, like this:

<p id="top">This is the top of the page!</p>
<h1 id="bottom">This is the bottom! </h1>

• An id should be descriptive to make it easier to remember the purpose of a link. The target link is a string containing the # character and the target element’s id.

<ol>
  <li><a href="#top">Top</a></li>
  <li><a href="#bottom">Bottom</a></li>
</ol>

Comments

<!-- Favorite Films Section -->

Review

1. The declaration should always be the first line of code in your HTML files. This lets the browser know what version of HTML to expect.

2. The html element will contain all of your HTML code.
   Information about the web page, like the title, belongs within the of the page.

3. You can add a title to your web page by using the element, inside of the head.

4. A webpage’s title appears in a browser’s tab.

5. Anchor tags (a) are used to link to internal pages, external pages or content on the same page.

6. You can create sections on a webpage and jump to them using a tags and adding ids to the elements you wish to jump to.

7. Whitespace between HTML elements helps make code easier to read while not changing how elements appear in the browser.

8. Indentation also helps make code easier to read. It makes parent-child relationships visible.
   Comments are written in HTML using the following syntax: .

plus : vleog에서 글자색 입히깅

  <span style="color:red">red</span>
<span style="color:#d3d3d3">#d3d3d3</span>
<span style="color:rgb(245, 235, 13)">rgb(245, 235, 13)</span>