티스토리 뷰
패스트캠퍼스 프론트엔드 올인원 with React 강의 수강 33일차입니다!
오늘부터 10번째 커리큘럼 'CSS / 개요, 선택자, 상속' 과정 공부를 시작하였습니다.
오늘 수강한 첫 번째, 두 번째 클립은 입문자 파트와 HTML 파트를 공부하면서 계속 언급되었던 내용인데,
더 공부하고 싶었지만 내일 오전에 중요한 일정이 있어서 준비하느라 오늘은 2개 클립만 들었습니다. 😂
오늘은 '01. 기본문법 / 02. 선언방식'에 대한 강의를 들었습니다.
새로 알게된 지식은 @import 문법에 관련한 것입니다.
<Today I Learned>
<선택자>
🔶 HTML의 특정 부분을 검색하여 연결하는 역할
<속성(Property)과 값(Value)>
🔶 검색된 대상에 지정될 CSS 명령 세트
🔶 선택자로 검색된 대상에 각 속성과 값을 삽입하여 스타일을 지정함
🔷 속성: 글자색 / 값: 빨강
<선언방식>
<인라인(inline) 방식>
🔶 HTML 태그 안에 style 속성 삽입 ➡ 이 방식은 '선택자'가 필요하지 않음
<내장(embedded) 방식>
🔶 HTML의 <style></style> 안에 작성
<링크(link) 방식>
🔶 HTML <link>를 이용하여 외부문서로 CSS를 불러와 적용하는 방식 (추천)
<@import 방식>
🔶 CSS의 @import를 이용하여 외부문서로 CSS를 불러와 적용하는 방식 (at 규칙)
- HTML
<head>
<link rel="stylesheet" href="css/common1.css" />
</head>
- CSS
/* common1.css 파일 */
@import url("./common2.css");
✨ HTML, JS 등 코드의 컴파일 과정: 병렬식
➡ 코드가 순서대로 거의 동시에 읽힘 (n초 안에 동시에 읽힘)
✨ @import 컴파일 과정: 직렬식
➡ 한 @import 를 읽는데에 n초 걸림 -> 결과적으로 'n * @import 개수' 만큼의 시간이 걸림
학습 내용 출처 : https://heropy.blog/2019/05/26/html-elements/
한눈에 보는 HTML 요소(Elements & Attributes) 총정리
인터넷에 검색 가능한 많은 HTML 문서들의 내용을 요소(Elements), 속성(Attributes)의 개념으로 핵심적인 내용들만 요약해서 정리했습니다. 각 요소들의 자세한 설명은 패스트캠퍼스 온라인 강의(online
heropy.blog
강의 링크: https://bit.ly/3m0t8GM
'[패캠] 프론트엔드 패키지 > CSS' 카테고리의 다른 글
| [패스트캠퍼스 수강 후기] 프론트엔드 인강 100% 환급 챌린지 35회차 미션 (0) | 2020.11.22 |
|---|---|
| [패스트캠퍼스 수강 후기] 프론트엔드 인강 100% 환급 챌린지 34회차 미션 (0) | 2020.11.21 |
| [패스트캠퍼스 수강 후기] 프론트엔드 인강 100% 환급 챌린지 8회차 미션 (0) | 2020.10.26 |
| [패스트캠퍼스 수강 후기] 프론트엔드 인강 100% 환급 챌린지 7회차 미션 (0) | 2020.10.25 |
| [패스트캠퍼스 수강 후기] 프론트엔드 인강 100% 환급 챌린지 6회차 미션 (0) | 2020.10.24 |