inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

[ 부트스트랩 5 ] 빠르고 스마트하게 웹 사이트 만들기 | Bootsrap 입문용

플렉스박스 교차축 정렬 (align-속성)

왜 flex-item box3 대신 .box3를 사용하나요?

218

고예진

작성한 질문수 7

0

<div class="container"> <div class="flex-item">1</div> <div class="flex-item">2</div> <div class="flex-item box3">3</div> </div>여기서 3번째 box만 class="flex-item box3" 하고 css 페이지에서 .box3이라고 해도 3번째 박스만 css적용이되는데 왜 이렇게 써야하는지 이해가 가지 않습니다. 왜 flex-item box3{ padding:30px}이라고 하지 않는것인가요? 이런 코드는 또 어떤 경우에 적용할 수 있나요?

HTML/CSS

답변 1

1

코드덤

box3{ padding:30px} 처럼, HTML 파일에 스타일 속성을 넣을 경우, 추후 유지 관리하기 쉽지 않습니다. 또한 하나의 웹사이트에 여러 개의 html 파일이 사용되기도 하는데, 그 경우 스타일 속성이 중복될 수 있습니다. 이러한 이유로 스타일 속성을 별도의 CSS 파일로 분리해서 관리하는 것이 일반적입니다.

아주 간단한 웹페이지를 만드는 경우에는 말씀하신 방법대로 사용하셔도 무방합니다.

해당 내용은,

"섹션 8-1 CSS 적용 방식 3가지 " 파트에서 간략하게 소개하고 있습니다.

약 10:00 분 구간에 위에 대한 간략한 내용이 나오니, 섹션 8-1을 참고해 주세요.

그럼 좋은 하루되세요!

bitnami 설치

0

7

0

강의 소스 코드는 어디서 볼수 있나여?

1

20

1

자료집 관련

0

13

2

13. (App 2) 기본기 훈련 에서

0

21

1

17강 강의에 목데이터 첨부파일이 없습니다.

2

26

2

2. 어떤 도구를 사용하는 것이 가장 유리할까? 강의 중

0

23

1

11차시 Antigravity IDE 설치 후

0

23

1

처음 에이전트 설정을 잘못 했을 경우 수정 하는 방법

0

27

1

5,6,7,8 내용이 없어요

0

28

1

푸터에 있는 카테고리 폰트 컬러 어떻게 바꾸나요?

0

32

1

장치 의존성과 CSR

0

35

1

순수 함수 / 순수 컴포넌트

0

24

1

css box-sizing 관련 질문

0

35

2

여태 만들던걸 다른 도메인으로 옮길 수도 있을까요?

0

28

1

node.js 설치 (LTS버전)

0

30

1

Cursor & Antigravity 소개 및 설치

0

35

2

뉴스페이퍼 테마 관련

0

35

1

지우지 말아야할걸 지운상태로 저장해버렸어요....

0

34

1

css 적용불가

0

296

1

혹시 html에 html파일 include하는 방법은 없나요?

0

1672

1

예제파일이 모두 빈 파일입니다.

0

309

2

강의자료 다운로드 어디서 하나요?

0

432

2

부트스트랩5 중급, 고급 과정도 개설해 주셨으면 좋겠습니다.

1

449

1

맥북으로 작업이 가능한가요

0

413

2