2022-03-01 HTML_2

Attributes

example

<p class="ramen is delicious"> My cat is so grumpy</p>
# class="ramen ins delicious" 부분은 attributes에 해당한다.

Attributes contain extra information about the element that won't appear in the content.

 

• 띄어쓰기로 element name과 다른 attribute와 구분되어야 한다.
• The attribute name 뒤에는 =가 붙는다.
• An attribute value는 인용구 "가 앞뒤로 감싼다.

---

 

Anchor for a hyperlink.

<a> : a는 anchor를 뜻한다. hyperlink를 끌어오는 느낌으로 anchor를 사용하는 듯하다.

 

각 element마다 사용할 수 있는 attributes가 다른 듯하다.

 

a의 경우 대표적으로 href, title, target을 사용할 수 있다.

• href : This attribute's value specifies the web address for the link.
• For example : href="https://www.mozilla.org/"

 

• title : The title attribute specifies extra information about the link, such as a description of the page that is being linked to.
• For example, title="The Mozilla homepage". This appears as a tooltip when a cursor hovers over the element.

 

• target : The target attribute specifies the browsing context used to display the link.
• For example, "target="_blank" will display the link in a new tab. If you want to display the linked content in the current tab, just omit this attribute.

 

<a href="https://ramen4598.tistory.com/" title="description" target="_blank">ramen_blog> ramen_blog</a>

---

 

Boolean attributes

values 없이 쓰이는 경우가 있다.

 

이 경우 우리는 Boolean attributes라고 부른다.

 

Boolean attributes는 사실 하나의 value를 가진다.

 

기본적으로 attribute name과 value는 같고 그렇기에 생략될 수 있다.

 

<input type="text" disabled="disabled">

<!-- value 생략 -->
<input type="text" disabled>

---

 

Single or double qoutes?

' 또는 "을 사용해서 value를 감쌀 수 있다.

 

원하는 대로 사용하면 된다.

 

단, value안에 '혹은 "가 이미 포함된 경우는 주의하자.

<a href='https://www.example.com' title='Isn't this fun?'>A link to my example.</a>
<!-- 오류 발생 Isn't의 '가 문제를 발생시킨다.-->

<a href='https://www.example.com' title='Isn&apos;t this fun?'>A link to my example.</a>
<!-- 혹은 아래로 고치면 된다.-->

<a href="https://www.example.com" title="Isn't this fun?">A link to my example.</a>

특정한 경우 quote기호를 생략해도 문제가 발생하지 않다.

 

하지만 일반적으로 사용하는 편이 좋다.

 

예상치 못한 문제를 예방할 수 있다.