inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

퀘이사(Quasar) 완벽 마스터: Vue 프론트 웹을 빠르게 만들고 싶다면! (Based Vue3)

Spacing - Padding, Margin 간격 활용하기

spacing 직접 지정

해결된 질문

279

밤의멜로디

작성한 질문수 15

0

 안녕하세요

강의 잘 보고 있습니다.

다름이 아니라 padding 혹은 margin을 직접 크기를 주고 싶을 땐 어떻게 해야 할까요?

다른 프레임워크에서는 보통 뒤에 -숫자를 넣으면 해당 숫자만큼 margin 혹은 padding이 되던데 Quasar에서는 어떻게 되는지 궁금합니다.

quasar vuejs

답변 1

0

짐코딩

안녕하세요 :)

프레임워크 별 차이인 것 같아요. 퀘이사에서는 아래 정의된 사이즈([none|auto|xs|sm|md|lg|xl])로 표기할 수 있고요.

커스텀한 간격을 원한다면

  • <style> 태그에 스타일링을 할 수도 있고

  • 아니면 별도의 사이즈(예: xxl, 3xl)를 정의할 수도 있겠죠?

q-[p|m][t|r|b|l|a|x|y]-[none|auto|xs|sm|md|lg|xl]
    T       D                   S

T - type
  - values: p (padding), m (margin)

D - direction
  - values:
      t (top), r (right), b (bottom), l (left),
      a (all), x (both left & right), y (both top & bottom)

S - size
  - values:
      none,
      auto (ONLY for specific margins: q-ml-*, q-mr-*, q-mx-*),
      xs (extra small),
      sm (small),
      md (medium),
      lg (large),
      xl (extra large)

참고 - https://quasar.dev/style/spacing

 

ComboBox 관련해서 질문 드립니다.

0

72

2

<g-page class="q-pa-xl"> 했는데도 여백 안생김

0

84

2

quasar intellisense extension 관련 문의

0

264

2

q-tab 오류 문의

0

241

1

q-upload 문의 드립니다.

0

494

1

q-input과 :rules 속성을 함께 쓸때, items-center 속성이 이상한 현상

0

311

1

Key값으로 Object 사용가능할까요?

0

232

1

npm run build 시 오류 발생합니다

0

462

1

fontawsome 사용법

0

252

1

Quasar 관련 익스텐션

0

218

1

VUE를 이용해서 프로그램 파일을 실행할수 있을까요?

0

411

1

q-input 태그 내용사라짐

0

274

1

q-input 컴포넌트 질문

0

467

1

버튼이 마음대로 크기가 바뀌어요

0

655

1

다크 모드 처리 관련하여 질문드립니다.

0

534

1

script setup 태그 유무에 따라서 페이지 출력이 안됩니다.

0

546

3

vue3 composition api (script setup) 사용 시 전역변수 접근

0

1446

1

한글 실시간 바인딩

2

2535

2

vue3 composition Api 사용시 setup 내부에서도 /src/boot에 설정한 constatns.js 값을 가져올수 있나요?

0

397

1

router.push로 이동 시, 유튜브 페이지의 컨텐츠 영역 안보이는 현상

0

465

1

validation

0

368

1

CORS 설정

0

606

1

질문 있습니다

0

336

1

Helper Classes

0

311

1