HTML

목록

설명 목록

용어와 그에 대한 설명을 나타낼 때 사용한다.

문법상 제한이 많아 현업에선 선호하지는 않는다.

가능한 자식요소로써는 <dt>, <dd>, <div>, <script>, <template>만 가질 수 있다.
=> <dt>, <dd>는 반드시 1개 이상 가져야 한다.

• <dl>(description list)
  => 설명 목록
• <dt>(definition term)
  => 설명할 용어
• <dd>(definition description)
  => 용어를 설명할 내용

인용문

짧은 인용문에서는 <q>를 사용하고, 긴 인용문에서는 <blockquote>를 사용한다.

• 자동으로 큰 따옴표가 삽입된다.
• <blockquote>에서는 자동으로 들여쓰기가 된다.
• 인용문의 출처를 가리킬 때는 cite속성을 사용한다.

  cite속성

  • 값에는 반드시 제목을 포함해야 한다.
  • 자동으로 기울임꼴로 표현된다.

어휘 요소

텍스트를 강조하거나 다른 일반적인 텍스트와 구분하기 위해 사용되며, 스타일을 위해서 사용해서는 안 된다.

의미가 있는 요소

strong
중요한 부분을 강조할 때 사용된다.

em
음성의 강조처럼 문장의 일부분을 강조해서 의미를 변경하는 데에 사용된다.

의미가 없는 요소

b
과거에는 의미 없이 굵은 글씨를 나타낼 때 사용되었으나, 굵은 글씨는 CSS로 구현하기 때문에 사용할 일이 잘 없을 것 같다.

i
기술 용어, 외국어, 생각 등 단순히 주위의 텍스트와 구분하기 위해 사용된다.

---

Sass

모듈

모듈 내보내기

• forward 할 때 cascading 되기 때문에 선언 순서도 고려해야 한다.

컨텐츠 블록(contents block)

믹스인을 정의할 때 코드를 삽입하지 않고, 믹스인을 사용할 때 코드를 삽입하고자 할 경우에, 해당 코드 부분을 컨텐츠 블록이라고 한다.

• 믹스인을 정의할 때
  => 컨텐츠 블록을 사용할 부분에 @content를 삽입한다
• 믹스인을 사용할 때
  => 믹스인 이름 뒤에 {}를 추가하고 안에 코드를 삽입한다

함수(function)

믹스인과는 다르게 계산해서 코드를 내보낼 때 사용한다.

@function 함수이름(변수이름) {
	@return 변수와연산의내용
}

• 연산을 할 경우에는 단위가 같아야 한다
  => 단위를 생략할 경우에는 한 쪽의 단위를 따라간다
• 나누기 연산을 할 때 인수의 단위가 같으면 단위가 제거된다
  => 함수를 중첩해서 단위를 변환하는 함수를 만들 수 있다

절대경로

이미지 등의 파일을 삽입한 scss 파일을 컴파일하는 과정에서 scss 파일과 css 파일의 경로가 서로 다를 때 불러올 수 없는 상황을 방지하기 위해 사용한다.
=> 일반적으로 사용하는 상대경로와 달리 '/'로 시작하며, 루트 디렉토리부터 경로를 작성한다.

주석

/*내용*/은 컴파일된다.
//내용은 컴파일되지 않는다.