HTML 기본 형식 2

Formatting

<b>: 굵게

<strong>: 중요한 문서, 굵게 나타낸다

<i>: 기울임꼴

<em>: 강조된 텍스트, 기울임꼴로 나타낸다

<mark>: 형광바탕으로 나타나는 텍스트

<small>: 글씨 크기가 기본본다 작은 텍스트

<del>: 삭제된 텍스트, 취소선으로 나타낸다

<ins>: 삽입된 텍스트, 밑줄로 나타낸다

<sub>: subscript 텍스트, 원래 텍스트보다 아래에 있는 텍스트 (아래 사진 참고)

<sup>: superscript 텍스트,  원래 텍스트보다 위에 있는 텍스트 (아래 사진 참고)

Quotation and Citation

• <blockquote>: 다른 source에서 가져온 인용문인다
• <q> : 짧은 인용문, 쌍따옴표를 삽입해준다
• <abbr>: 약자(abbreviation)을 나타낼 때 사용한다
• <address> : 연락 정보를 명시할 때 사용한다(email주소, url, 주소, 전화번호, sns 계정 등...)
  • 기울임꼴로 나타낸다
• <cite>: 제목을 명시한다, 기울임꼴로 나타낸다.
• <bdo>: BDO(Bi-Directional Override), 반대방향으로 텍스트를 나타낸다

<bdo dir="rtl">This line will be written from right to left</bdo>
<--! rtl: right -> left 방향으로 텍스트를 나타낸다 -->

HTML Comments (주석)

<!-- Write your comments here -->

Text Color

• background-color: 배경색을 입히는 것
• color: 글씨 색을 입히는 것
• border: 텍스트 밖에 사각형으로 태두리만 색을 입히는 것
• color values(색의 고유 번호)를 사용해서 색을 명시하는 것도 가능하다 
  • RGB: red, green , blue 빛원(light source)을 의미한다
    • rgb(red, green, blue) (참고로 검정은 rgb(0,0,0)
    • 0~255 사이의 숫자로 채도를 정하게 된다
    • 회색 계열은 숫자는 각 r, g, b 항목의 숫자를 동일하게 설정하면 된다
    • 색 조합을 확인하고 싶다면: 
  • https://www.w3schools.com/html/html_colors_rgb.asp

 

HTML RGB and RGBA Colors

• RGBA
  • RGB의 확장판이면서 투명도(opacity)가 조절가능한 값이다
  • rgba(red, green, blue, alpha), alpha 값을 이용해서 투명도를 조절한다
  • alpha 값은 0.0(완전 투명)부터 1.0(완전 불투명)까지이다
• HEX
  • #RRGGBB 값으로 색이 지정이 되는데, 이때 각 항목은 RR(red), GG(green), BB(blue) 를 의미한다
  • ff 은 0-255를 의미한다, 즉 최대치. (#ff0000은 빨간색을 의미한다)
  • RGB와 마찬가지로 세 개의 항목 숫자를 동일하게 하면 회색 계열 색이 나타난다
• HSL: hue, saturation, and lightness을 의미한다
  •  hsl(hue, saturation, lightness)
  • hue(0~360.0): 0: red / 120: green / 240: blue
  • saturation(0%~100%): 0%: black / 100%: full color
    • 색의 강도(intensity)를 의미한다
  • lightness(0%~100%): 0%: black / 100%: white
    • 색의 명도(how much light)을 의미한다
• HSLA: HSL의 확장판이면서 alpha 값으로 투명도(opacity)가 조절가능한 값이다
  • hsla(hue, saturation, lightness, alpha)
  • alpha 값은 0.0(완전 투명)부터 1.0(완전 불투명)까지이다